时间戳

首页 > 解决方案 > Angular 9没有设置动态输入字段值

typescript - Angular 9没有设置动态输入字段值

问题描述

升级到 Angular 9 版本后出现了一个奇怪的问题。我正在调用一个函数，该函数返回一个值来为输入表单字段设置默认值。该函数正在返回一个值，但在输入框中它没有显示该值，而是显示为[object object] 令人惊讶的是，如果我在 [placeholder] 中调用相同的函数，它会显示正确的返回值。我不知道，为什么它可以与 [placeholder] 一起正常工作，但在 [value] 中却不行。在 angular 8 中同样可以正常工作。

.html 文件

<mat-form-field>
   <input matInput formControlName="{{'item'+k}}" [placeholder]="getValue(k)"  [value]="getValue(k)" />
</mat-form-field>

ts文件

getValue(k:any) {
  let item;
  // ... some logic to get a desired value
  return item;
}

标签： typescriptangular9

解决方案

使用输入装饰器来初始化您的输入值。

在 ts 文件中，设置属性值，即：this.property = item 并使用 @input 装饰器进行初始化，然后在 html 中，使用 ngModel 指令将组件值绑定到属性。

请记住，您不能在同一元素中使用带有 value 属性的 ngModel。

推荐阅读