角材料自动完成功能可防止setValue的反应性起作用

用户名

编辑:解决与Jojofoulk的评论。

当使用角材料的自动完成组件时,我尝试使用setValue输入形式,但是其[matAutocomplete]属性阻止setValue了输入中显示。

检查反应性控件表明该值是正确的,而删除该控件则[matAutocomplete]可以使它起作用,但是随着它的出现,它并没有显示出来。

<mat-list-item role="listitem" *ngFor="let skill of curObj.skills;index as ind">
  <div>
    <mat-form-field>
      <input type="text" placeholder="choose skill" aria-label="Number" matInput [formControl]="skill.control" [matAutocomplete]="auto">
      <mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn" (optionSelected)="optSel($event.option.value,skill)">
        <mat-option *ngFor="let option of skill.filteredOptions | async" [value]="option">
          {{option.name}}
        </mat-option>
      </mat-autocomplete>
    </mat-form-field>
  </div>
</mat-list-item>
skill.control.setValue("some new value");
Jojofoulk

displayFn接受输入以不同的方式显示它(通常是在你输入一个对象的属性),但它需要整个对象!您应该确保setValue()用于设置对象,而不仅仅是要显示的值。

当您将输入与[matAutoComplete]using结合使用时[displayWith]输入应包含整个对象displayFn它将负责填充您的输入。

小例子

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章