Javascript AngularJS：ng模型到dom元素的后期绑定

我有一个网页，其中包含一些无法编辑的HTML元素。我想动态地将ng模型属性附加到这些属性上，并让AngularJS将它们重新绑定到范围。可以找到一个我想要完成的简单例子

函数MyCtrl（$scope）{
$scope.myModel1=“Hi”；
$scope.myModel2=“there”；
var myModel2=angular.element（“#myModel2”）；
//这行不通
myModel2.attr（“ng模型”、“myModel2”）；
}

您需要使用

$compile

（）

---

加载页面时，angular会自动在HTML上使用

$compile

，这样它就知道要为哪些元素分配哪些指令。如果您只是像您尝试的那样更改属性，angular不知道。您必须使用

$compile

抱歉，我没有足够的信誉点数来接受您的回答；到时候我会回来的！谢谢Mosho。下面是一个如何对ng模型进行后期绑定以选择的代码片段：$compile（angular.element（'timezone'）、angular.element（'timezone'）、angular.attr（'ng-model'，'vm.timezone'））（$scope）；

<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(myModel2.attr("ng-model", "myModel2"))($scope);