首页 文章

预成型垫自动完成角2材料2

提问于
浏览 次
1

当我尝试编辑记录时，我无法设置mat-autocomplete的值我使用自动完成作为FormBuilder对象中的FormControl对象，并设置从服务器收到的值我正在使用Formbuilder.setValue（）方法 . 但这不会设置自动完成，虽然它向服务器发送请求，因为我正在使用Observables的valueChanges方法...任何帮助将不胜感激

以下是我正在使用的代码

component.ts

this.filteredData = this.addDetailsForm.get('product').valueChanges
.debounceTime(400)
.do(value =>
{ let exist = this.myContent.findIndex(t => t.text === value);
if (exist > -1) return;
this._dataService.getSwiftProducts(value).subscribe((res: any[]) => { this.myContent = res; });
}).delay(500).map(() => this.myContent);

component.html

<div class="row">
<label class="col-lg-4 control-label">Product: </label>
<div class="col-lg-5">
<input type="text" class="form-control" (keyup.enter)="chooseFirstOption()" placeholder="Pick one" aria-label="Number" matInput ="product" formControlName="product" [matAutocomplete]="auto">
<p *ngIf="addDetailsForm.controls.product.errors">This field is required!</p>
<mat-autocomplete #auto="matAutocomplete" [displayWith]="displayFn"> <mat-option *ngFor="let option of filteredData | async" [value]="option"> {{ option.description }} </mat-option> </mat-autocomplete>
</div>

Angular，Material，OS，TypeScript的版本

Angular：“@ angular / core”：“^ 5.0.0”，材料：“@ angular / material”：“^ 5.0.0-rc0”，操作系统：Windows 7 Typescript：“typescript”：“^ 2.6.2”

angular angular-material2

1 回答

  • 1

    经过大量的研究甚至激怒了Angular Material的开发团队，我意识到我在尝试编辑记录时发送的响应是不正确的 . 我发送一个字符串作为自动完成的响应，而它应该是一个对象 . 这取决于 displayFn 函数的编写方式 . 下面是我的 displayFn function

    displayFn(object): string {
console.log("Display Object is ---> " + object);
return object ? object.description : object;

    }

    所以我需要发送一个对象作为回应..我向那些我可能已经窃听过的人道歉..

    回复于

相关问题