在Angular 2中设置构造函数之外的值

Question

我正在构造函数之外设置一个变量，并且我正在使用模板中的变量，但没有分配。我该如何实现？

@Component({
  selector: 'footer',
  template: `
    <div>
      {{id}} {{name}} {{ans}}
    </div>
  `,
})
export class App {
  id:number;
  name:string;
  ans:string;
  constructor() {
    this.id = `1`,
    this.name = `App`
  }
  king = ()=>{
    this.ans = "variable";
    alert("Working");
  }
}
var sapp = new App();
sapp.king();

这是我做的一个。

Answer 1

 var sapp = new App();

上线正在创建应用程序的new实例。通过这样做，您有两个实例。您正在调用您新创建的实例的king()方法。这就是为什么您无法正常工作的原因。

为了访问来自任何生命周期方法的同一实例调用king()。

例如。

import {Component, OnInit} from '@angular/core'
   ngOnInit() 
   {
   king();
   }

更新的plunkr

Answer 2

您可以使用ngOnInit方法。

import {Component, NgModule, VERSION, OnInit} from '@angular/core'
ngOnInit() 
{
  this.id = `1.0.2`,
  this.name = `Helical`
}

Answer 3

如果在页面/查看加载上需要，则可以初始化变量以及声明。否则，您也可以使用ngoninit进行相同的操作，但在ngoninit之前发射构造函数。

export class App {
  id:number;
  name:string;
  ans:string= "variable";
  constructor() {
    this.id = `1`,
    this.name = `App`
  }
}

现在您可以在模板中使用ANS。