@microf

Как заставить директивы общаться друг с другом?

Заспамлю я тостер за пару дней.
Есть директива, показывающая список прочитанных и непрочитанных сообщений. Хочется сделать еще директиву, которая будет показывать иконку с количеством непрочитанных сообщений в шапке. Логично, что эта директива должна зависеть от первой, но не является вложенной в первую. Как они общаются друг с другом? Как понимаю,require: '^?myNotifications', не подойдет?
Первая директива, которая забирает данные из сервиса:
angular
        .module('app.notifications')
        .directive('myNotifications', myNotifications);

function myNotifications() {
    var directive = {
        link: link,
        templateUrl: 'app/notifications/views/show.client.notification.html',
        restrict: 'EA',
        controller: NotificationController,
        controllerAs: 'notification'
    };
    return directive;

    function link(scope, element, attrs) {

    }
}
NotificationController.$inject = ['notificationService', '_'];


function NotificationController(notificationService, _) {

    var vm = this;
    vm.showNotificationList = false;
    vm.unreadNotifications = [];
    vm.readNotifications = [];
    activate();


    function activate() {
        return getNotifications().then(function () {
            SplitNotifications(vm.showNotificationList);
        });
    }
    ;

    function  getNotifications() {
        return notificationService.getNotificationsData()
                .$promise.then(function (data) {
                    vm.showNotificationList = data;
                    return vm.showNotificationList;
                });
    }
    function SplitNotifications(showNotificationList) {

        for (var i = 0; i < showNotificationList.length; i++) {
            vm.unreadNotifications = _.filter(showNotificationList, {status: '1'});
            vm.readNotifications = _.filter(showNotificationList, {status: '2'});
        }
    }

}

Вторая директива, которая должна брать массив unreadNotifications и считать его length и добавить в над иконкой:
angular
        .module('app.notifications')
        .directive('myNotificationsBell', myNotificationsBell);
function myNotificationsBell() {
    var directive = {
        link: link,
        require: '^?myNotifications',
        template: ' <md-button aria-label="Open notification" class="md-icon-button" ng-click="$mdOpenMenu()">' +
                '<md-icon md-svg-icon="notifications" ></md-icon><sup>3</sup>' +
                '</md-button>',
        restrict: 'EA',
        controller: NotificationBellController,
        controllerAs: 'bell'

    };
    return directive;
    function link(scope, element, attrs) {         
    }
    NotificationBellController.$inject = [];

    function NotificationBellController() {
       
    }
}

В общем, вопроса два - правильно ли я понимаю, что required не подходит для общения не nested директив и что делать?
Как-то из первой директивы делать notificationsetService.UnreadNotifications? Передавать из контроллера первой директивы данные в сервис, а вторым контроллером забирать? Или есть какой то проще способ?
  • Вопрос задан
  • 192 просмотра
Пригласить эксперта
Ответы на вопрос 1
Fesor
@Fesor
Full-stack developer (Symfony, Angular)
нет, пусть две эти директивы зависят от одного сервиса, который предоставляет эту информацию.

Общение директив имеет место быть если одна вложена в другую или у них есть реальная необходимость общаться. В вашем случае одна директива просит сервис пометит что-то прочитанным, а другая просто мониторит количество не прочитанных и среагирует на изменение.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы