设定值输入

我正在使用 Angular2，我有一个简单的表格：

<div class='col-12'>
      <div class="form-group">
             <label class="form-control-label" for="nombre">Nombre</label>
             <input class="form-control input-md" placeholder="Ingresar nombre identificador de la Lista" #nombre="ngModel" required id="nombre" name="nombre" type="text" [(ngModel)]="lista.nombre">
             <small class="form-text text-muted danger" *ngIf="send && lista.nombre === ''">Debe ingresar un nombre para la Lista de Chequeo</small>
      </div>
</div>

在组件中，我有一个类型的对象Lista

export class ListaChequeoEditComponent implements OnInit {
    title = 'Lista de Chequeo';
    lista: Lista;
    id_lista: any;

    constructor(private router: Router,
        private route: ActivatedRoute, private formDataService: FormDataService,
        private workflowService: WorkflowService, public partidaService: PartidasServiceService, public ubicacionService: UbicacionService,
        public listaService: ListaService) {
    }

    obtenerLista(){
        this.route.queryParams.subscribe(params => {
            this.id_lista = params["id_lista"];
            this.listaService.getLista({id_lista: this.id_lista}).subscribe(
            result => {
                var objLista = new Lista(
                    result[0].nombre
                );
                this.lista = objLista;

            }, error => {
                this.loading = false;
                console.log(error);
            });
        });
    }

    ngOnInit() {
        this.obtenerLista();
    }
}

模型：

export class Lista {
    nombre: string = '';

    constructor(nombre: string){
        this.nombre = nombre;
    }
}

我从对 api 的调用中获取对象的值并尝试设置它们：

this.lista.nombre = 'Nuevo Nombre';

但我得到了错误

错误类型错误：无法读取未定义的属性“名称”

版

我实现了 Pablo 的解决方案，但它仍然不起作用。

生成器：

constructor(private router: Router,
    private route: ActivatedRoute, private formDataService: FormDataService,
    private workflowService: WorkflowService, public partidaService: PartidasServiceService, public ubicacionService: UbicacionService,
    public listaService: ListaService) {
        this.lista = new Lista();
}

ngOnInit

ngOnInit() {
    this.obtenerLista();
}

obtenerLista(){
    this.route.queryParams.subscribe(params => {
        this.id_lista = params["id_lista"];
        this.listaService.getLista({id_lista: this.id_lista}).subscribe(
        result => {
            var objLista = new Lista();
            objLista.nombre = result[0].nombre
            this.lista = objLista;
            console.log(this.lista);

        }, error => {
            this.loading = false;
            console.log(error);
        });
    });
}

this.lista如果更新的值，我通过打印检查它，但在 DOM 中数据没有更新。