Add angular binding to node added by jquery

Question

Is it possible to bind a model to an html node which is added by jQuery? I tried:

 $('mydiv').append('<input ng-model="myValue" type ="text" );

what does not work. Model is not binded.

I'd rather advise you to drop jQuery manipulation with Angularjs, it's MVC the View should be driven by Controller — maurycy
– maurycy, Commented Jul 31, 2014 at 10:01

Arun P Johny · Accepted Answer · 2014-07-31 09:51:06Z

1

You need to use compile the new element

//assuming $scope refer to the scope to which it has to be binded
var $el = $('<input ng-model="myValue" type ="text" />').appendTo('mydiv')
$compile($el)($scope);

Demo: Fiddle

answered Jul 31, 2014 at 9:51

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Add angular binding to node added by jquery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related