Angularjs 在子指令中使用来自父指令和$scope的值
示例: 我有两条指令,即父指令和子指令,适用于:Angularjs 在子指令中使用来自父指令和$scope的值,angularjs,Angularjs,示例: 我有两条指令,即父指令和子指令,适用于: <div parent parent-model="model"> <div child>Child</div> </div> 我创建了这个孩子,如下所示: angular.module("app").directive("child", child); function child() { var child = { link: link, replace: fals
<div parent parent-model="model">
<div child>Child</div>
</div>
我创建了这个孩子,如下所示:
angular.module("app").directive("child", child);
function child() {
var child = {
link: link,
replace: false,
restrict: "A"
};
return child;
function link(scope, element, attributes, controller) {
// NEED parent-model value here.
console.log(controller.model); // Returns undefined
}
}
我尝试了一些方法来实现这一点,但没有成功
至少我认为这是我需要做的,对吗?您可以使用范围属性在指令范围内的变量和属性中定义的父控制器之间创建双向绑定
scope: {model: '=model'}
对于第二个问题,答案很简单。只要指令不创建独立的作用域,您的指令作用域原型将从其父作用域继承
在您给出的片段中
console.log(scope.model)
在第二个链接中,函数应允许您访问父范围中的模型变量
一个很好的技巧是,$parent
仍然可以作为父作用域的引用,即使您创建了一个独立的作用域 这里有一个使用$parent
的解决方案
现场示范
角度模块('ExampleApp',[])
.controller('ExampleController',函数($scope){
$scope.model={
x:2
};
})
.指令(“母公司”,母公司)
.指令(“儿童”,儿童);
函数父函数(){
变量父项={
控制器:控制器,
链接:链接,
替换:false,
是的,
模板:“”,
限制:“A”,
范围:{
父模型:“=”
}
};
返回父母;
功能控制器($scope){
log('parent',$scope.parentModel);
}
函数链接(范围、元素、属性){}
}
函数子(){
变量子项={
链接:链接,
替换:false,
限制:“A”,
}
返回儿童;
函数控制器($scope){}
功能链接(范围、元素、属性){
log('child link',scope.$parent.parentModel);
}
}
小孩
由于child没有创建独立的作用域,因此在继承作用域时,您可以在child的链接函数中访问父数据<代码>范围。模型
不起作用?老实说,我和你的答案迷路了。。。我尝试了很多选择,但总有一些地方出了问题。。。您能提供一个例子吗?`函数链接(范围、元素、属性、控制器){scope.model//不起作用?}`您可以在child指令中使用require
。示例var child={link:link,require:“parent”…
然后在函数link
中使用参数controller
@stepankasysanenko我尝试了,但返回了未定义的结果…检查我更新的答案:console.log(controller.model);但是使用model=“=model”有什么区别还有$scope?我无法使您的代码正常工作。我在中创建了一个示例。请您提供一个更完整的示例,好吗?您可以为我的示例提供一个更完整的示例。谢谢您先学习本教程
console.log(scope.model)