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();

这是a plunker I made。

Answer 1

 var sapp = new App();

以上一行是为您的应用创建new个实例。通过这样做，您有两个应用程序实例。您正在调用新创建的实例的king()方法。这就是你没有让它发挥作用的原因。

为了从任何生命周期方法中访问相同的实例调用king()。

例如。

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

   ngOnInit() 
   {
   king();
   }

更新了Plunkr

Answer 2

您可以使用import {Component, NgModule, VERSION, OnInit} from '@angular/core' ngOnInit() { this.id = `1.0.2`, this.name = `Helical` }方法。

{{1}}

Answer 3

如果在页面/视图加载时需要，可以将变量与声明一起初始化。否则你也可以使用ngOnInit执行相同操作，但在ngOnInit之前触发Constructor。

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

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

在Angular 2中的构造函数外部设置一个值

3 个答案: