ng-model doesn't work when I create new DOM elements
Jordi Martínez
When I create a new DOM element (out of angular), angular doesn't take it under control. Why?
I show you a simplified example :
<html ng-app="gemStore">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>
<body ng-controller="StoreController as store">
<button onclick="changeDom();">CreateDomElementWithDataBinding</button>
<input type='text' ng-model='store.bright'/>
<div id='placeNewElement'>
</div>
<script type="text/javascript">
angular.module('gemStore',[]).controller('StoreController', function(){
this.name = 'diamont';
this.bright = 3;
});
var changeDom = function(){
document.getElementById('placeNewElement').innerHTML = "<input type='text' ng-model='store.name'/>";
};
</script>
</body>
</html>Here, initial DOM is created with an input that have databinding with scope.bright data model. When you click on the button, a new element is created, with ng-model to make a databinding with scope.name. But when new DOM element is created, angular doesn't 'managed' its element (doesn't show scope.name value, doesn't put typical angular classes (ng-valid, etc) to the element).
I searched a lot and I can't solve it :-( I tryed to make scope.apply() to upload model, but this appears not to be the problem (because angular doesn't know this new element).
I can not change the way that new DOM elements are created (is not my hand to change). But I can execute JS after create new elements. Mey be angular just can 'register data binding' on DOM elements when document loads?
Tnaks for help! ;-)
Jordi
Jordi Martínez
Kevin Shay
--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.