Как вызвать служебную функцию в AngularJS ng-click (или ng-change,...)?
При вызове такой функции:
HTML:
<select ng-model="var" ng-change="myFunction(var)">
<option ng-repeat="option in alloptions">{{option}}</option>
</select>
JS:
$scope.myFunction = function(){//do things}
все работает отлично, но когда моя функция находится внутри службы (которая может быть достигнута контроллером), функция не вызывается. вызывая его, помещая имя службы в качестве префикса, также не является вариантом (даже если это работает в самом коде javascript) myService.myFunction(var)
Итак, мой вопрос: как правильно обращаться к сервисам в ng-change, когда они находятся в службе?
заблаговременно
Ответы
Ответ 1
Вам необходимо вызвать сервисные функции, используя функции через область. Таким образом, в вашем примере вы можете вызвать метод службы внутри метода myfunction области, если ваша служба была введена в ваш контроллер.
$scope.myFunction = function(var){
myService.myFunction(var);
}
Всегда помните, что в пользовательском интерфейсе доступны только свойства, определенные в $scope, а не ваши службы.
Ответ 2
В то время как ответ Whizkids технически корректен, я не вижу проблемы, отображающей весь сервис для представления, прикрепляя его непосредственно к области. Однако это зависит от сложности вашего проекта и дизайна ваших услуг.
Например, большинство служб, относящихся к состояниям повторного использования, которые я пишу, - это просто набор функций, один из которых раскрывает базовые данные.
return {
getData: function() { return container; },
doSomethingOnData: function() { /* some manipulation of container */ }
};
Теперь вы можете получить доступ к служебным данным, добавив их просто к переменной $scope
:
$scope.serviceData = MyService.getData();
Таким образом, ваши возможности для доступа к сервисным функциям - либо пойти с ответом Whizkids, либо создать функции переноса, прикрепленные к области видимости, или открыть службу непосредственно для представления.
$scope.$MyService = MyService;
Чтобы вы могли сделать что-то вроде:
<div ng-click="$MyService.doSomethingOnData()"></div>
В то время как эта практика строго противоречит принципам разделения углов, она делает код кратким, если у вас есть много функций внутри вашего сервиса, которые вам нужно выставлять с помощью простых оберток.