我如何使用从标签属性从控制器传递到指令的数据？它在控制台中显示未定义。
App.directive('applist', ['$rootScope', function($rootScope) {
'use strict';
return {
restrict: 'E',
scope: {
gamesList: '=',
}.
link: function(scope,attrs){
console.log(scope.gamesList); //undefined
}
}
}])
和 html：
<applist games-List="games">
<div ng-repeat="(key, value) in gamesList | groupBy: 'game.id'"> ... </div>
</applist>
您必须将标记更改为：
<applist games-list="games">...</applist>
此外，在角度中，属性中的驼峰与 html 标记中的"-"一起使用。你忘记了"游戏"的"s">
编辑：如前所述，链接前的点使指令中断。尝试：
return {
restrict: 'E',
scope: {
gamesList: '='
}, //change dot to coma
link: function(scope,attrs){
console.log(scope.gamesList); //undefined
}
}
使用 @ 获取字符串值： 修改后的代码：
<!DOCTYPE html>
<html ng-app="myApp">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<applist games-list="games"></applist>
<script>
var App=angular.module('myApp',[]);
App.directive('applist', ['$rootScope', function($rootScope) {
'use strict';
return {
restrict: 'E',
transclude:true,
scope: {
gamesList: '@',
},
link: function(scope,attrs){
console.log(scope.gamesList); //games
}
}
}])
</script>
</body>
</html>
要从指令属性中获取数据，您可以使用以下代码
console.log(scope.gamesList(;
您的指令将是
App.directive('applist', ['$rootScope', function($rootScope) {
'use strict';
return {
restrict: 'E',
scope: {
gamesList: '@',
},
link: function(scope,attrs){
console.log(scope.gamesList); //games
}
}
}])