javascript - TypeError : self. context.newUser 在 Angular2 上未定义

Question

当我尝试在模板上添加输入字段时，出现此错误 TypeError: self.context.newUser is undefined

这是组件

import { Component } from '@angular/core';
import { OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { User } from './user';
import { UserService } from './user.service';


@Component({
  selector: 'vista3',
  templateUrl: 'app/vista3.component.html',
  styleUrls:['app/vista3.component.css']
})

export class Vista3Component implements OnInit{
  users: User[] = [];
  newUser: User;

  constructor(
    private router: Router,
    private userService: UserService) {
  }

  ngOnInit(){
    this.userService.getUsers().then( users => this.users = users);
  }
}

模板

<div  class="separar">
  <table class="table table-striped">
      <tr>
        <th>Nombre</th>
        <th>Apellido</th>
      </tr>
        <tr *ngFor="let user of users">
          <td>{{user.name}}</td><td>{{user.lastName}}</td>
        </tr>
  </table>
</div>
<div  class="separar">
  <div class="row">
    <div class="col-xs-12 col-md-3">
      Nombre: <input [(ngModel)]="newUser.name"/>
    </div>
  </div>
</div>

和用户类

export class User{
  name: string;
  lastName: string;
}

我不知道我错过了什么，angular2 和 typescript 对我来说是新的，如果有人能看到问题...

Answer 1

1. 看起来您从未将任何内容分配给 newUser 类成员。

2. [(ngModel)]="newUser.name" 行中的触发器错误。

您尝试从undefined 获取name。我建议使用 ?. 运算符。

<input [(ngModel)]="newUser?.name"/>

并且还在构造函数中创建一个空用户:

  constructor(
    private router: Router,
    private userService: UserService) {

    this.newUser = new User;
  }