Menu
I've used ng-bind in angularjs like this
<div ng-bind="getVal()"></div>
where getVal() return some value and it was in the controller.
But In Angular2 , I have a function getVal() in the component and I need to call it from the template, in the same way like angular1.
I tried
<div [(ngModel)]="getVal()"></div>
But no luck, any idea?
272
The ng-bind directive tells AngularJS to replace the content of an HTML element with the value of a given variable, or expression. If the value of the given variable, or expression, changes, the content of the specified HTML element will be changed as well.
ngModel usually use for input tags for bind a variable that we can change variable from controller and html page but ngBind use for display a variable in html page and we can change variable just from controller and html just show variable.
The ng-bind-html directive is a secure way of binding content to an HTML element. When you are letting AngularJS write HTML in your application, you should check the HTML for dangerous code. By including the "angular-sanitize.
Data binding in AngularJS is the synchronization between the model and the view. When data in the model changes, the view reflects the change, and when data in the view changes, the model is updated as well.
Of course {{ getVal() }} will work as JB Nizet suggests when you want the returned value of your function to appear somewhere inline in the body of some HTML string. However, what you're actually after is...
Angular 1 Style:
<div ng-bind="getVal()"></div>
becomes...
Angular 2+ ng-bind equivalent:
<div [textContent]="getVal()"></div>
Angular 2+ ng-bind-html equivalent:
<div [innerHtml]="getVal()"></div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
