Why is the element wrapping incorrectly?

Question

JavaScript

zamena.replaceWith('<input type="text" ng-model="name" id="inputNewName" autofocus>');
$('#inputNewName').after('<p id="trash" class="ng-binding">{{name}}</p>');

As planned, the paragraph with id='trash' should display the text from the input field. But there is always {{name}}. Where is the mistake?

Answer 1

Most likely that the inserted pieces of code are not compiled.
You need to use $compile in order for angular to know about the new elements.
Something like that:

var elem1 = zamena.replaceWith('<input type="text" ng-model="name" id="inputNewName" autofocus>');
var elem2 = $('#inputNewName').after('<p id="trash" class="ng-binding">{{name}}</p>');
$compile(elem1)($scope);
$compile(elem2)($scope);