我有一个基于作为属性发送的数组构建html的指令。我无法从指令的编译器函数访问它。它在链接函数内部工作,但我需要在编译内部,否则新模板不会被编译。
代码是这样的:
<multirangeslider values="ranges" variances="['Master', 'master A', 'master B']"></multirangeslider>
指令:
angular.module("vtApp.directives").
directive('multirangeslider', function ($parse, $timeout, $compile) {
return {
restrict: 'E',
replace: true,
scope: {
values: "=",
options: "=",
variances: "&"
},
compile: function (element, attrs) {
var htmlText, variances, values;
variances = eval(attrs.variances);
values = scope.ranges //scope is undefined
values = eval (attrs.variances) //returns string "ranges"
values = ??? ///what should I put here?
htmlText = '<div></div>';
element.replaceWith(htmlText);
return function (scope, element, attrs){
}
}
}
});
感谢
答案 0 :(得分:4)
在编译函数返回的LinkingFunction之前,您将无法访问范围。编译函数创建html模板。然后,在LinkingFunction期间,范围与模板组合。
我不确定你要做什么,但我会在链接功能上使用标准模板或templateUrl对象,而不是潜入编译功能。 Somethig喜欢这样:
angular.module("vtApp.directives").
directive('multirangeslider', function ($parse, $timeout, $compile) {
return {
restrict: 'E',
replace: true,
template: "<div ng-repeat='val in values'>{{val}}</div>", //Your template code
scope: {
values: "=",
options: "=",
variances: "&"
},
link: function (scope, element, attrs) {
scope.values = eval(attrs.variances)
}
}
});
您可以在此处找到有关如何构造指令的更多信息: https://github.com/angular/angular.js/wiki/Understanding-Directives