從 mat-autocomplete 獲取源 FormControl

Question

我有一個動態 matInput 對象表，如下所示：

    <div formArrayName="salesItems">
        <table class="app-sales-items-table">
            <thead>
                <th>Qty</th>
                <th>Item #</th>
                <th>Description</th>
                <th>Weight</th>
                <th>Serial No</th>
                <th>Unit Price</th>
                <th>Item Discount %</th>
                <th>Line Total</th>
            </thead>
            <tbody>
                <tr *ngFor="let item of salesItemsForm.get('salesItems').controls; let index=index" [formGroupName]="index">
                    <td>{{item.qty}}</td>
                    <td>
                        <mat-form-field class="field-full-width">
                            <input type="text" matInput formControlName="itemNumber" [matAutocomplete]="autoItemNumber">
                        </mat-form-field>
                    </td>
                    <td>
                        <mat-form-field class="field-full-width">
                            <input type="text" matInput formControlName="description" [matAutocomplete]="autoDescription">
                        </mat-form-field>

                    </td>
                    <td>{{item.weight}}</td>
                    <td>{{item.serialNumber}}</td>
                    <td>{{item.unitPrice}}</td>
                    <td>{{item.itemDiscount}}</td>
                    <td>{{item.lineTotal}}</td>
                </tr>
            </tbody>
        </table>
    </div>

每個 matInput 都有一個對應的 mat-autocomplete，例如：

    <mat-autocomplete #autoDescription="matAutocomplete" (optionSelected)="setSelectedSalesItem($event.option.value, $event.source)">
        <mat-option *ngFor="let option of (filteredSalesItems )" [value]="option">{{option.description}}
        </mat-option>
    </mat-autocomplete>

如您所見，在 optionSelected 方法中，我傳入了 $event.source。 我的真正目標是獲取觸發事件的 FormControl，這樣我就可以在同一行中設置其他值。 問題是 $event.source 是 MatAutoComplete 類型，我不確定如何從中獲取（反應性）FormControl。

編輯：

堆棧閃電： https://stackblitz.com/edit/angular-mzryga?file=src%2Fapp%2Fapp.component.ts

Answer 1

您可以向 function 調用添加另一個參數。 您已經有了formControlName ，您可以傳遞formControlName [itemNumber/description]並使用它來獲取formControl 。

Answer 2

我想我明白了。 我移動了 ngFor 的內部。 因為我的 ngFor 看起來像這樣：

<tr *ngFor="let item of salesItemsForm.get('salesItems').controls; let index=index" [formGroupName]="index">

我可以傳入item ，它是從那里開始的肉汁。