Javascript 使用模板访问angular指令中的父范围
我想重用一个表单来编辑一种类型的属性。我有一份编辑名单:Javascript 使用模板访问angular指令中的父范围,javascript,angularjs,Javascript,Angularjs,我想重用一个表单来编辑一种类型的属性。我有一份编辑名单: ModelerControllers.controller('ModelController',['$rootScope','$scope','$http','$q', 函数($rootScope,$scope,$http,$q){ ... $scope.mappingTypes=[ {“名称”:“混合面板”,“标签”:“混合面板”}, {“名称”:“mongo”,“标签”:“mongo”}, {“名称”:“切片器”,“标签”:“切片器”
ModelerControllers.controller('ModelController',['$rootScope','$scope','$http','$q',
函数($rootScope,$scope,$http,$q){
...
$scope.mappingTypes=[
{“名称”:“混合面板”,“标签”:“混合面板”},
{“名称”:“mongo”,“标签”:“mongo”},
{“名称”:“切片器”,“标签”:“切片器”},
{“名称”:“sql”,“标签”:“sql”},
{“名称”:“”“标签”:“其他”}
];
...
}
]);
然后我有一个指令:
CubesModelerApp.directive("mappingEditor", function() {
return {
templateUrl: 'views/partials/mapping.html',
require: "ngModel",
scope: {
content: "=ngModel",
mappingTypes: "@mappingTypes"
},
link: function($scope, $element, $attrs) {
$scope.mappingTypes = $scope.$parent.mappingTypes;
}
}
});
用作:
<div mapping-editor ng-model='content.mapping'></div>
具有模板内容(相关区块):
...
...
这将产生空列表–就好像mappingTypes
是空的一样
来自ngModel
的conent
已正确绑定
如何访问指令模板中的全局(从父作用域之一)枚举?或者有没有其他方法来实现这一点,比如以不同的方式定义列表而不是app$scope变量
编辑:这里有一个。尝试设置参数
映射类型
<div mapping-editor mapping-types='storeTypes' ng-model='content.mapping'></div>
如果您在指令中设置了scope对象,这意味着这个范围是隔离的,我不确定您是否能够到达父范围。从$parent对象。尝试设置参数映射类型
<div mapping-editor mapping-types='storeTypes' ng-model='content.mapping'></div>
如果您在指令中设置了scope对象,这意味着这个范围是隔离的,我不确定您是否能够到达父范围。来自$parent对象。您的代码有几个问题:
1.
根据关于自定义指令的独立范围:
=或=attr-在本地作用域属性和通过attr属性值定义的名称的父作用域属性之间设置双向绑定
(强调矿山)
这意味着您需要引用一个属性,该属性的值是要共享的父作用域属性的名称。例如:
...
<editor ng-model="content" my-items="items"></editor>
...
scope: {
...
items: '=myItems'
},
2.
根据关于select
元素的说明,ng model
属性是必需的。您必须将其添加到模板字符串中:
...
template:
...
'<select ng-model="selectedItem"...
另请参见此您的代码有几个问题:
1.
根据关于自定义指令的独立范围:
=或=attr-在本地作用域属性和通过attr属性值定义的名称的父作用域属性之间设置双向绑定
(强调矿山)
这意味着您需要引用一个属性,该属性的值是要共享的父作用域属性的名称。例如:
...
<editor ng-model="content" my-items="items"></editor>
...
scope: {
...
items: '=myItems'
},
2.
根据关于select
元素的说明,ng model
属性是必需的。您必须将其添加到模板字符串中:
...
template:
...
'<select ng-model="selectedItem"...
另请参见$scope.mappingTypes=$scope.$parent.mappingTypes
works–根据JS调试器,属性在链接
函数中的$parent
中正确设置。它在模板中只是空的。我希望避免需要另一个属性,因为它是多余的–在整个应用程序中都是相同的。链接()
是否准备好模板的作用域?@Stiivi,要确保mappingTypes集合已填充,请在选择后添加以下html,
,如果可以,请尝试保留以下内容,
。如果可行,请逐个更改模型并添加属性,以找出问题所在。我创建了一个模型,显示了我遇到的问题。好的,应该在您的小提琴中更改一些东西。1.将items变量传递给编辑器
。2.在指令items:'='
中以以下方式声明items
变量。3.您需要为select标记提供型号和标签。而且它有效!$scope.mappingTypes=$scope.$parent.mappingTypes
works–根据JS调试器,属性在链接
函数中的$parent
中正确设置。它在模板中只是空的。我希望避免需要另一个属性,因为它是多余的–在整个应用程序中都是相同的。链接()
是否准备好模板的作用域?@Stiivi,要确保mappingTypes集合已填充,请在选择后添加以下html,
,如果可以,请尝试保留以下内容,
。如果可行,请逐个更改模型并添加属性,以找出问题所在。我创建了一个模型,显示了我遇到的问题。好的,应该在您的小提琴中更改一些东西。1.将items变量传递给编辑器
。2.在指令items:'='
中以以下方式声明items
变量。3.您需要为select标记提供型号和标签。而且它有效!一把小提琴往往会得到更多/更快/更好的答案…这是一把小提琴:一把小提琴往往会得到更多/更快/更好的答案…这是一把小提琴:谢谢。不带my items=“items”
是否可以使用它?这是多余的,因为它在整个应用程序中都是相同的。或者,您可以将隔离作用域的项
属性与其父作用域的项
属性绑定在链接
函数:链接:函数(作用域、元素、属性){scope.items=scope.$parent.items;}
从范围:{…}
中删除所有必需的$parent属性后,这似乎解决了我的问题。请参阅我的原始帖子,它既有作用域:{mappingTypes:…}
又有