我正在使用 Angular 14 嘗試創建一個選擇表單，從我的組件中的陣列中讀取選項。選擇選項已正確填充，但當我發送表單時，未發送所選選項值。它只是讓它空著。關于可能導致此問題的任何建議？
<mat-label>Perfil</mat-label>
<mat-select name="perfil">
<mat-option *ngFor="let perfil of perfis"
[value]="perfil.value">{{ perfil.title }}
</mat-option>
</mat-select>
在組件中，陣列是：
perfis: {title: string, value: number }[] = [
{ "title": "Admin", "value": 1 },
{ "title": "Coordenador", "value": 2 },
{ "title": "Colaborador", "value": 3 },
];
內部表單組件的建構式：
this.form = this.formBuilder.group({
id: [''],
login: [''],
password: [''],
nome: [''],
rg: [''],
cpf: [''],
telefone: [''],
email: [''],
ativo: [''],
perfil: ['']
});
提交表格：
onSubmit() {
console.log(this.form.value); // this is where I see the field is always empty
this.usersService.save(this.form.value)
.subscribe(
data => this.onSuccessInsertion('Informa??o inserida do banco de dados.'),
error => this.onError('N?o foi possível salvar esta informa??o no banco de dados.')
);
}
也許我列出了選項，但在被選中后我沒有捕捉到價值？如果是這樣，我應該怎么做？我讀到過您可以使用 [selected]，但 Angular 甚至無法識別。
我注意到這可能是因為該值被捕獲為字串。我在另一篇文章中讀到 [value]="..." 僅支持字串值，而 [ngValue]="..." 支持任何型別因此需要在 [ngValue]="perfil.value" HTML，但如果我 [ngValue] 而不是 [value]，它會給我錯誤。錯誤資訊是：
無法系結到“ngValue”，因為它不是“mat-option”的已知屬性。
- 如果“mat-option”是一個 Angular 組件并且它有“ngValue”輸入，那么驗證它是這個模塊的一部分。
- 如果“mat-option”是一個 Web 組件，則將“CUSTOM_ELEMENTS_SCHEMA”添加到該組件的“@NgModule.schemas”以抑制此訊息。
- 要允許任何屬性，請將“NO_ERRORS_SCHEMA”添加到此組件的“@NgModule.schemas”中。ngtsc(-998002)
uj5u.com熱心網友回復：
似乎選擇與FormGroup. 正因為如此，Angular 不知道 select 應該改變perfil表單中的控制元件。假設您在模板中設定了前面的，您可以使用指令FormGroup將選擇系結到該控制元件，如下所示：formControlName
<mat-select name="perfil" [formControlName]="'perfil'">
<mat-option *ngFor="let perfil of perfis"
[value]="perfil.value">{{ perfil.title }}
</mat-option>
</mat-select>
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/537238.html
標籤：有角度的角度材料垫选择