Angularjs 如何绑定父作用域属性?
我需要从父元素获取子元素中的“c”属性(请参见中的) 可能吗Angularjs 如何绑定父作用域属性?,angularjs,Angularjs,我需要从父元素获取子元素中的“c”属性(请参见中的) 可能吗 <div ng-app="myApp"> <box c="yellow"> <item>item</item> </box> </div> angular.module('myApp', []) .directive('box', function() { return { restrict: 'E'
<div ng-app="myApp">
<box c="yellow">
<item>item</item>
</box>
</div>
angular.module('myApp', [])
.directive('box', function() {
return {
restrict: 'E',
replace: true,
transclude: true,
template: '<div ng-transclude></div>'
};
})
.directive('item', function() {
return {
restrict: 'E',
replace: true,
scope: {c:'='},
template: '<div>c:{{c}}</div>'
};
});
项目
angular.module('myApp',[])
.directive('box',function(){
返回{
限制:'E',
替换:正确,
是的,
模板:“”
};
})
.directive('item',function(){
返回{
限制:'E',
替换:正确,
作用域:{c:'='},
模板:“c:{{c}”
};
});
使用translcude时,父dom对象实际上不是作用域树中的父对象。这里有很好的范围继承描述:
你可以直接得到它,但这不是一个美丽的方式:
var app = angular.module('plunker', []);
app.directive('box', function(){
return {
restrict: 'E',
replace: true,
transclude: true,
scope: { c: '@' },
template: '<div ng-transclude></div>'
};
});
app.directive('item', function(){
return {
restrict: 'E',
replace: true,
template: '<div>c:{{$parent.$$prevSibling.c}}</div>'
};
});
var-app=angular.module('plunker',[]);
应用程序指令('box',函数(){
返回{
限制:'E',
替换:正确,
是的,
作用域:{c:'@'},
模板:“”
};
});
app.directive('item',function(){
返回{
限制:'E',
替换:正确,
模板:“c:{$parent.$$previsibling.c}”
};
});
例如:
我相信有更多类似ng的方法可以做到这一点…因为您的item指令定义了一个隔离作用域,所以您需要为您想要的每个作用域属性在item上定义一个属性。因此,您至少需要:
<item c="c">item</item>
.尝试覆盖链接功能和访问范围。$parent
link: function(scope, element, attrs) {
scope.c = attrs.c;
}