AngularJS：使用指令的所有元素都显示相同的值
我有一个指令，它通过这样一个属性传递对作用域数据的引用（假设AngularJS：使用指令的所有元素都显示相同的值,angularjs,Angularjs,我有一个指令，它通过这样一个属性传递对作用域数据的引用（假设$scope.parent.child存在）： 该指令在使用一次时按预期工作。但是，当多次使用并且使用不同的项属性值时，使用该指令的所有元素都显示相同的值 下面是我的完整代码，这里有一个Plunker:。如果您注意到，使用指令（第8行）更改第二个元素上的item=值会将所有元素的值更改为该值 我做错了什么？如何使每个元素/指令脱离其单独的项属性？谢谢 <!DOCTYPE html> <html ng-app='fam
$scope.parent.child项item=项<!DOCTYPE html>
<html ng-app='familyApp'>
<head>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div ng-controller='BaseController'>
<p>{{ parent.child.name }}: <span status-label item='parent.child'></span></p>
<p>{{ root.name }}: <span status-label item='root'></span></p>
</div>
</body>
<script data-require="jquery@1.7.1" data-semver="1.7.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://code.angularjs.org/1.2.12/angular.js" data-semver="1.2.12" data-require="angular.js@1.2.12"></script>
<script>
var familyApp = angular.module('familyApp', []);
angular.module('familyApp').controller('BaseController',
function ($scope) {
$scope.root = {
name: 'Jack',
age: 40,
flagged: false
};
$scope.parent = {
child: {
name: 'Jill',
age: 30,
flagged: true
}
};
});
angular.module('familyApp').directive('statusLabel',
function ($compile, $parse) {
return {
link: function (scope, element) {
scope.status = function (item) {
item = $parse(element.attr('item'))(scope);
if (item.flagged === true) {
return 'flagged';
}
return 'clean';
};
},
transclude: true,
template: '<div ng-switch on="status()"><div ng-switch-when="flagged">Flagged</div><div ng-switch-when="clean">Clean</div></div>'
};
});
</script>
</html>
{{parent.child.name}}：
{{root.name}}：
var familyApp=angular.module（'familyApp'，[]）；
角度。模块（'familyApp'）。控制器（'BaseController'，
职能（$范围）{
$scope.root={
名字：“杰克”，
年龄:40,，
标记：false
};
$scope.parent={
儿童：{
名字：“吉尔”，
年龄:30,，
标记：正确
}
};
});
angular.module（'familyApp'）。指令（'statusLabel'，
函数（$compile，$parse）{
返回{
链接：功能（范围、元素）{
scope.status=功能（项目）{
item=$parse（element.attr（'item'））（范围）；
如果（item.flagged==真）{
返回“已标记”；
}
返回“干净”；
};
},
是的，
模板：“FlaggedClean”
};
});