Angular 2 ngModel Not Binding Object属性在类定义中定义

Question

我是角度2的新手，我尝试了[（ngModel）]，如下所示。

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  template: `<input [(ngModel)]="model.name" name="name"> <h1>{{model.name}}</h1>`
})
export class AppComponent  { 
constructor() {
}
model = {name: "some value"};
}

上面的代码在浏览器中初始加载网页时产生如下所示的输出。

第二个是..

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  template: `<input [(ngModel)]="model.name" name="name"> <h1>{{model.name}}</h1>`
})
export class AppComponent  { 
constructor() {
}
model = {};
model.name = "some value";
}

这个产生以下输出..

请解释两个代码示例之间的区别以及为什么它不能在第二个示例中工作..

提前致谢。

Answer 1

因为你不能在那里做作业。您可以将赋值移动到构造函数或任何其他生命周期方法中：

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  template: `<input [(ngModel)]="model.name" name="name"> <h1>{{model.name}}</h1>`
})
export class AppComponent  { 
constructor() {
   this.model.name = "some value";
}
model = {};

}

另外，如果您查看已编译的js文件，您会看到类似的内容：

function AppComponent() {
      this.model = {};
      this.name = "some value";
}