How to bind a model using ng-bind-html?

Question

Angular

The situation is this - as a result of manipulation inside the program, I get a line like '';
I display this string using $sce.trustAsHtml in the template - everything is fine, the input is displayed, but the trouble is that ng-model is not active in this element. I suspect this is because it is rendered through the $sce middleware.
How do I output html to my template, and at the same time bind an object from the controller scope where we are to this dynamic element. It is difficult to explain in words, so here is
plnkr.co/edit/7ZXF0w35aDVnznepwr1f
There are two inputs, one was created initially in the template - and the model is bound to it, as we see, without problems. But the one that we generate through trustAsHtml does not participate in the further work of Angular at all.
Tell me, how can I solve this problem? Or have I taken the wrong approach?
Thank you!

Answer 1

This is absolutely not the angular-way, and it started a little earlier than the moment from which you started describing the problem.
$sce.trustAsHtml is used to render static html.
To modify the DOM and further use it, you need directives. Describe the task.