AngularJS : DOM 요소의 후기 바인딩

Question

편집 할 수없는 일부 HTML 요소가있는 웹 페이지가 있습니다. 나는 이들에 ng-model 속성을 동적으로 연결하고 AngularJS가 범위에 다시 바인딩되도록하려고합니다. 내가 달성하고 싶은의 간단한 예 당신은 사용할 필요가

<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> 

Answer 1

here를 찾을 수 있습니다 당신은 당신의 페이지에 각 용도를 $compile로드 $compile (docs)

$compile(myModel2.attr("ng-model", "myModel2"))($scope); 

demo

HTML은 자동으로 어떤 지시자를 할당 할 것인지를 안다. 시도한 것처럼 속성을 변경하면 각도는 알 수 없습니다. $compile을 사용해야합니다.