我有一些角度代码在angularjs 1.2.0-rc.1,rc.2和rc.3中有效。但它在1.2.0和1.2.1中不起作用。
我在http://plnkr.co/edit/KBYFJQ2sZeOJ79Hid1gG
上说明了问题我的HTML
<!DOCTYPE html>
<html ng-app="app">
<head>
<script data-require="angular.js@1.2.1" data-semver="1.2.1"
src="http://code.angularjs.org/1.2.1/angular.js"></script>
<link rel="stylesheet" href="style.css"/>
<script src="script.js"></script>
</head>
<body ng-controller="AppCtrl">
<ul>
<li ng-repeat="menuEntry in menuItems">
<a ng-href="#" ng-click="{{menuEntry.action}}">{{menuEntry.text}}</a>
</li>
</ul>
</body>
</html>
我的角度代码是
'use strict';
angular.module('app', [])
.controller('AppCtrl', function ($scope) {
var menuItems = [
{
text: "Log off",
action: 'logoff()'
}
];
var logoff = function () {
alert("logoff called")
};
$scope.menuItems = menuItems;
$scope.logoff = logoff;
});
如果我使用1.2.0-rc.3运行此代码,它运行时没有错误,当我点击链接时,我会收到一个警告框。但如果我用1.2.0或1.2.1运行它,我会收到一个错误:
Error: [$parse:syntax] Syntax Error: Token 'menuEntry.action' is unexpected, expecting [:] at column 3 of the expression [{{menuEntry.action}}] starting at [menuEntry.action}}].
有人可以帮我解决这个问题吗?
答案 0 :(得分:2)
ngClick
的文档并未表明您可以对可调用表达式使用{{..}}绑定。我认为它可能只是在旧版本中偶然发生,并且新版本中的实现更改已经破坏了它。
无论如何,这似乎是一种奇怪的方式来挂钩你的代码。你能用一个真正的函数替换action属性来调用吗? e.g。
angular.module('app', [])
.controller('AppCtrl', function ($scope) {
$scope.logoff = function () {
alert("logoff called")
};
$scope.menuItems = [
{
text: "Log off",
action: $scope.logoff
}
];
});
然后
<a ng-href="#" ng-click="menuEntry.action()">{{menuEntry.text}}</a>
如果您确实需要以动态表达式开头,可以使用$scope.eval
来调用它。 e.g。
var menuItems = [
{
text: "Log off",
action: 'logoff()'
}
];
angular.forEach(menuItems, function(menuItem) {
menuItem.callableAction = function() { return $scope.$eval(menuItem.action); }
});
然后
<a ng-href="#" ng-click="menuEntry.callableAction()">{{menuEntry.text}}</a>