AngularJS передает строку как функцию для использования при ng-click
Я хочу назначить функцию javascript для ng-click, имя которого получено службой отдыха.
<li ng-class="{ active: isActive('url')}" data-ng-repeat="menu in mb.data">
<a href="{{menu.href}}" data-ng-click="{{menu.javascript}}">{{menu.label}}</a>
</li>
К сожалению, парсер angularjs генерирует исключение, если использовать {{}} внутри ng-click. Поэтому я пробовал несколько обходных решений, таких как использование функции обратного вызова
<a href="{{menu.href}}" data-ng-click="call(menu.javascript)">{{menu.label}}</a>
Но ни одна из моих идей не удалась. Как назначить имя функции javascript в ng-lick? Btw. сама функция является частью $scope.
Изменить. Вот контроллер:
Услуга "$ menu" - это просто запрос на отдых. Результат запроса - это json-объект и содержит только строковые значения. В текущей проблеме результатом для menu.javascript является "loginModal()".
.controller('HeaderController', function($scope, $http, ModalService, $menu, $routeParams) {
$scope.loginModal = function() {
console.log("modal", ModalService);
// Just provide a template url, a controller and call 'showModal'.
ModalService.showModal({
templateUrl: "/modals/login.modal.html",
controller: "LoginController"
}).then(function(modal) {
// The modal object has the element built, if this is a bootstrap modal
// you can call 'modal' to show it, if it a custom modal just show or hide
// it as you need to.
console.log(modal.element);
modal.element.modal();
modal.close.then(function(result) {
console.log(result ? "You said Yes" : "You said No");
});
});
};
$menu.get($routeParams, function(data){
$scope.menu = data;
});
})
Изменить 2:
Интересно, когда я использую {{menu.javascript}}, то правильная строка "loginModal()" доступна в DOM. Но парсер angular остановился там из-за ошибок.
Ответы
Ответ 1
Вы можете сделать что-то вроде этого
HTML
<div ng-controller="TodoCtrl">
<button ng-click="callFunction('testClick')">CLICK ME</button>
</div>
контроллер
function TodoCtrl($scope) {
$scope.callFunction = function (name){
if(angular.isFunction($scope[name]))
$scope[name]();
}
$scope.testClick = function(){
alert("Called");
}
}
Рабочий скрипт
Надеюсь, это поможет вам. Спасибо.
Ответ 2
Вы можете использовать нотацию hashmap, обращаясь к свойству объекта 'this' (который в этом случае равен $scope):
<li ng-class="{ active: isActive('url')}" data-ng-repeat="menu in mb.data">
<a href="{{menu.href}}" data-ng-click="this[menu.javascript]()">{{menu.label}}</a>
</li>