当我通过具有指令的字符串生成一个新元素（这就是我需要编译的原因）并且该指令通过“=”生成与控制器范围内的变量的关联时，我的控制器中的变量与指令中的一项。
我创建了一个 jsfiddle 来展示“门”ng-model 值应该与所有指令模型值相关联的示例。
看到这个小提琴：http: //jsfiddle.net/aVJqU/2/
我注意到的另一件事是，从 html 中存在的元素运行的指令通过变量（控制器和指令）显示了正确的关联。
html（有绑定的指令<door>）：
<body ng-app="animateApp">
<div ng-controller="tst">
<h2> Controller with its model </h2>
<input ng-model="doorval" type="text"> </input>
{{doorval}}
<h2> Directive render directly from the html </h2>
<door doorvalue="doorval"></door> <key></key>
<h2> Directives that are compiled </h2>
<list-actions actions="actions"></list-actions>
</div>
</body>
这是指令：
animateAppModule.directive('door', function () {
return {
restrict: "E",
scope: {
doorvalue:"="
},
template: '<span>Open the door <input type="text" ng-model="doorvalue"> </input> {{doorvalue}}</span>',
replace: true
}
})
这是控制器：
var animateAppModule = angular.module('animateApp', [])
animateAppModule.controller('tst', function ($scope, tmplService) {
$scope.doorval = "open"
$scope.actions = tmplService;
})
animateAppModule.service('tmplService', function () {
return [{
form_layout: '<door doorvalue="doorval"></door> <key></key>'
}, {
form_layout: '<door doorvalue="doorval"></door> with this <key></key>'
}]
})
最后，这是编译具有未绑定指令的字符串的指令：
animateAppModule.directive('listActions', function ($compile) {
return {
restrict: "E",
replace: true,
template: '<ul></ul>',
scope: {
actions: '='
},
link: function (scope, iElement, iAttrs) {
scope.$watch('actions', function (neww, old,scope) {
var _actions = scope.actions;
for (var i = 0; i < _actions.length; i++) {
//iElement.append('<li>'+ _actions[i].form_layout + '</li>');
//$compile(iElement.contents())(scope)
iElement.append($compile('<li>' + _actions[i].form_layout + '</li>')(scope))
}
})
}
}
})
我该怎么做才能将所有“门” ng-model 值绑定在一起？编译后的指令绑定到哪里？