angular's ng-init alternative in Angular 2

Question

What is the alternative of ng-init=\"myText=\'Hello World!\'\" in Angular 2 to add in the template, not in the component

 


        
                      

              相关标签:
       
      

Answer 1

@Directive({
  selector: '[ngxInit]',
})
export class NgxInitDirective {
  constructor(
    private templateRef: TemplateRef<any>,
    private viewContainer: ViewContainerRef) {
  }

  @Input() set ngxInit(val: any) {
    this.viewContainer.clear();
    this.viewContainer.createEmbeddedView(this.templateRef, {ngxInit: val});
  }
}

a value expression is set via *ngxInit and published using as micro-syntax:

<div *ngxInit="3 * i + j as idx">{{idx}}</div>

published as https://www.npmjs.com/package/ngx-init

Answer 2

It is possible by using OnInit Life Cycle hook as below,

1. Import OnInit from core library

   import {Component, OnInit} from '@angular/core'
   

2. Implement it to your component class

   export class App  implements OnInit {
   
   }
   

3. Implement the ngOnInit method

    ngOnInit(){
       this.myText='Hello World!'
   
      }
   

LIVE DEMO