Вызов функции директивы от контроллера angularjs

Question

У меня есть этот контроллер

.controller('MyCtrl', ['$scope', '$rootScope', 'restService', 
    function ($scope, $rootScope, restService) {      
     $scope.saveTask = function (workflow, form) { 
      if (form.$valid) { 
       if (workflow.isSaved == false) { 
        angular.toJson(workflow); 
        $rootScope.$broadcast('saveOrDelete', 1); /*HERE IS CALLING*/ 
       }; 
      } 
     }; 
    } 
]);   

И моя директива с saveOrDelete функции:

.directive('logWork', [function() { 
    return { 
    restrict: 'AE', 
    link: function(scope, element, attrs) { 
      scope.saveOrDelete = function(option) { 
       switch (option) { 
        case 1: { 
         angular.element(element).find('.note-input').css('width', '85%'); 
         angular.element(element).find('.active-accept-button').css('display', 'none'); 
         angular.element(element).find('.active-delete-button').css('display', 'inline-block'); 
        } break; 

        case 2: { 
         angular.element(element).find('.note-input').css('width', '70%'); 
         angular.element(element).find('.active-accept-button').css('display', 'inline-block'); 
         angular.element(element).find('.active-delete-button').css('display', 'inline-block'); 
        } break; 
       }; 
      }; 
     }, 
       templateUrl: Global.directives.worklogblock 
    }; 
}]) 

И у меня есть проблема, я не могу назвать свою saveOrDelete функции от контроллера , Как я могу это сделать? Пожалуйста, помогите мне решить эту проблему.

Answer 1

В вашей директиве вам необходимо прослушать saveOrDelete событие, которое вы излучаете в своем контроллере. Затем у вас есть доступ к аргументам, переданным в broadcast или emit, и может работать с ними.

$scope.$on('saveOrDelete', function(event, option) { $scope.saveOrDelete(option); }); 

Имейте в виду, что-нибудь в вашем приложении будут уволены, если они слушают к этому событию.

Не слишком уверен, что вы знаете разницу между broadcast и emit, перечисленные ниже в документах. Они могут придать странное поведение, если вы не знаете, подумал, что лучше всего упомянуть об этом.

EDIT: На боковой ноте ваша упаковка вашего элемента в angular.element Я не думаю, что это абсолютно необходимо. Если у вас включен JQuery до углового, то объект элемента будет полным объектом JQuery. Если нет, это будет объект JQueryLite.

Emit и широковещательные документы, вы также найдете документацию на прослушивание событий ($on) на этой странице: https://docs.angularjs.org/api/ng/type/ $ rootScope.Scope # $ испускают

Answer 2

Вы используете $ радиопередачу неправильно.

$scope.$on('saveOrDelete', function(event, option) { 
    switch (option) { 
    case 1: { 
    angular.element(element).find('.note-input').css('width', '85%'); 
    angular.element(element).find('.active-accept-button').css('display', 'none'); 
    angular.element(element).find('.active-delete-button').css('display', 'inline-block'); 
    } break; 

    case 2: { 
    angular.element(element).find('.note-input').css('width', '70%'); 
    angular.element(element).find('.active-accept-button').css('display', 'inline-block'); 
    angular.element(element).find('.active-delete-button').css('display', 'inline-block'); 
    } break; 
};});