CODEWITHSUNDEEP
javascriptangularjsangularangular2-template
Chuanqi Sun
Chuanqi Sun

Reputation: 1382

ng2 initialize DOM property once and drop change detection

In angular 1, I can do

<span ng-bind="::expression"></span>

to set the innerHTML of the span without creating a watcher.

In angular 2, I'm thinking of a few ways to do it but I don't know if the change detector is still alive after initialization. Since I just want to initialize the innerHTML once, it would be nice to remove change detection after first pass. Can someone help?

  1. <span [innerHTML]="expression"></span>
  2. <span innerHTML="{{expression}}"></span>
  3. <span>{{expression}}</span>

And regarding 2. I found in official document that bracket can be ommitted when doing string initialization, but I don't know what happens when it's combined with {{}} interpolation. https://angular.io/docs/ts/latest/guide/template-syntax.html#!#one-time-string-initialization

Upvotes: 0

Views: 90

Answers (1)

Andrei Zhytkevich
Andrei Zhytkevich

Reputation: 8099

You can change the way how a component does change detection:

@Component({changeDetection:ChangeDetectionStrategy.OnPush})
class MyComponent {
  ...
}

More information: http://blog.thoughtram.io/angular/2016/02/22/angular-2-change-detection-explained.html and http://victorsavkin.com/post/110170125256/change-detection-in-angular-2

Upvotes: 1

Related Questions