结合angular js中的绑定项和表达式
[英]combine binded item and expression in angular js
问题描述
In HTML:
在 HTML 中：
<ul class="list-group">
<li ng-repeat="item in simpleListVM.datasource track by $index" class="list-group-item">
<simple-list-items listitem="item" listitemid="{{item.data.name + $index + 1}}"></simple-list-items>
</li>
</ul>
In Directive:在指令中：
scope: {
listitem: '=',
listitemid:'&'
}
When I run the application it shows error.当我运行应用程序时，它显示错误。
Syntax Error: Token '{' invalid key at column 2 of the expression [{{item.data.name +$index + 1}}] starting at [{item.data.name +$index + 1}}].
2 个解决方案
解决方案1
1 已采纳 2017-02-15 04:58:56
That is because the listitemid you provided is an interpolated expression and should be a function as defined by listitemid: '&' .那是因为您提供的listitemid是一个内插表达式，应该是listitemid: '&'定义的函数。
To me it seems you want to change listitemid: '&' to listitemid: '@' .对我来说，您似乎想将listitemid: '&'更改为listitemid: '@' 。 This will bind to the result of the expression.这将绑定到表达式的结果。
解决方案2
0 2017-02-15 05:09:17
Stephen J Barker is right, please check my example code, Stephen J Barker 是对的，请检查我的示例代码，
<!DOCTYPE html> <html ng-app="plunker"> <head> <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script> </head> <body ng-controller="MainCtrl"> <ul class="list-group"> <li ng-repeat="item in simpleListVM.datasource track by $index" class="list-group-item"> <simple-list-items listitem="item" listitemid="{{item.name + $index + 1}}"></simple-list-items> </li> </ul> </body> <script> var app = angular.module('plunker', []); app.controller('MainCtrl', function($scope) { $scope.simpleListVM = {}; $scope.simpleListVM.datasource = [{ 'name': 'test1' }, { 'name': 'test2' }, { 'name': 'test1' }]; }).directive("simpleListItems", function() { var dir = {}; dir.scope = { listitem: '=', listitemid: '@' }; dir.link = function(s, e, a) { console.log("listitem", s.listitem); console.log("listitemid", s.listitemid); } return dir; }); </script> </html>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.