Блог

Я создаю директиву в angularjs, чтобы изменить текст в моем представлении углового месяца, но когда я переключаю свое представление с недели на месяц, оно не отображает мои данные.

 <script id="customMonthCell.html" type="text/ng-template">
    <div size-elt class="cal-month-day {{day.cssClass}}">
        <span
            class="pull-right"
            data-cal-date
            ng-click="vm.calendarCtrl.dateClicked(day.date)"
            ng-bind="day.label">
        </span>

        <small style="position: absolute; bottom: 10px; left: 5px">{{monthCalendarDayDivWidth}}
            <div style="display:inline-block;margin-bottom: 5px;" ng-repeat="(petitTitle, events) in day.groups track by petitTitle">
                <span ng-if="events.length > 1 amp;amp; monthCalendarDayDivWidth > 130">               
                    {{events[0].description}}
                </span>
                <span ng-if="events.length > 1 amp;amp; monthCalendarDayDivWidth <= 130">               
                    {{littleTitle}}
                </span>
            </div>
        </small>
    </div>
</script>



tabs.directive('sizeElt', ['$window', function ($window) {

    return {
        link: link,
        restrict: 'A'
    };

    function link(scope, element, attrs) {
        angular.element($window).bind('resize', function () {
            scope.windowWidth = $window.innerWidth;
            scope.monthCalendarDayDivWidth = element[0].offsetWidth
            scope.$apply();
        });
        angular.element($window).bind('load', function () {
            scope.windowWidth = $window.innerWidth;
            scope.monthCalendarDayDivWidth = element[0].offsetWidth
            scope.$apply();
        });
    }
}]);
 

Это когда я загружаю свою страницу

это когда я нажимаю на просмотр за неделю и возвращаюсь к просмотру за месяц

Это похоже на то, что ширина monthCalendarDayDivWidth не определена, но если я заставлю ее при переключении представления, она все равно не сработает

 $scope.monthCalendarDayDivWidth = $scope.windowWidth > 1080 ? 140 : 110
 

Я изменяю свою директиву, чтобы, когда я переключаю представление в своем календаре, данные могли быть видны

 tabs.directive('sizeElt', ['$window', function ($window) {

    return {
        link: link,
        restrict: 'A'
    };

    function link(scope, element, attrs) {
        angular.element($window).bind('resize', function () {
            scope.windowWidth = $window.innerWidth;
            scope.monthCalendarDayDivWidth = element[0].offsetWidth
            scope.$apply();
        });

        if (element.offsetWidth !== 0 || element.offsetHeight !== 0) {
            setTimeout(function () {
                scope.windowWidth = $window.innerWidth;
                scope.monthCalendarDayDivWidth = element[0].offsetWidth
                scope.$apply();
            }, 0);
        }
    }
}]);