我有一个网页,其中包含一些我无法编辑的 HTML 元素。我想动态地将 ng-model 属性附加到这些属性,并让 AngularJS 将它们重新绑定(bind)到范围。可以找到我想要完成的简化示例 here
<script src="//code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min.js"></script>
<script>
function MyCtrl($scope) {
$scope.myModel1 = "Hi";
$scope.myModel2 = "there";
var myModel2 = angular.element("#myModel2");
//This won't work
myModel2.attr("ng-model", "myModel2");
}
</script>
<div ng-app ng-controller="MyCtrl">
<input type="text" ng-model="myModel1"/>
<!-- I can't touch this -->
<input type="text" id="myModel2" />
</div>
最佳答案
您需要使用$compile
( docs )
$compile(myModel2.attr("ng-model", "myModel2"))($scope);
当您加载页面时,angular 会自动在 HTML 上使用 $compile
,这就是它知道将哪些指令分配给哪些元素的方式。如果你只是像你尝试的那样改变属性,angular 不知道。您必须使用 $compile
。
关于javascript - AngularJS:ng-model 到 dom 元素的后期绑定(bind),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22933988/