Question

我有一个在我的模板中渲染的网格，如下所示。网格有多个下拉列表（每行一个），当我点击一个按钮时，我会收集这些值。但是，在我单击按钮后，我想将所有下拉菜单重置为默认值。

<div>
    <button (click)="onClickUpdate($event, filteredRequesters)">Update</button>
</div>
<tbody>
    <tr *ngFor='let requester of filteredRequesters'>
        <td>
          <select id="ddStatus" type="number" (change)="onChange($event.target.value, requester)">
             <option *ngFor="let level of levels">
    {{level.name}}</option>
          </select>
        </td>
        <td>{{ requester.RequesterID }}</td>
        <td> {{ requester.FullName }} </td>
        <td>{{ requester.CompanyName }}</td>
        <td>{{ requester.RequesterClass}}</td>
        <td>{{ requester.Address}}</td>
        <td>{{ requester.MobilePhone}}</td>
        <td>{{ requester.TotalRequests}}</td>
        <td>{{ requester.EmailAddress}}</td>
    </tr>
</tbody>

这是一个数组，用于设置typescript组件中选择下拉列表中的选项。

   levels: Array<{ num: number, name: string, total: number }> = [
    { num: 0, name: "ignore", total: 0 },
    { num: 1, name: "child", total: 0 },
    { num: 2, name: "parent", total: 0 }
   ];

最后这里是按钮点击的代码：

 onClickUpdate(event, filteredRequesters) {

    var count: number;
    count = 0;

    for (var i = filteredRequesters.length - 1; i >= 0; i--) {
        if (count > 1) {
            continue;
        }

        if (filteredRequesters[i].isDisabled == 2)
            count++
    }

    if (count == 1) {
        this._productService.updateRequester(filteredRequesters);
        var countToRemove: number;
        // get new total requests for merged reqwester  
        var countIndex: number = 0;
        countToRemove = 0;
        for (var i = filteredRequesters.length - 1; i >= 0; i--)
            if (filteredRequesters[i].isDisabled == 1) {
                countToRemove += filteredRequesters[i].TotalRequests;
            }
            else if (filteredRequesters[i].isDisabled == 2)
                countIndex = i;

        filteredRequesters[countIndex].TotalRequests += countToRemove;
        filteredRequesters[countIndex].isDisabled = 0;

        for (var i = filteredRequesters.length - 1; i >= 0; i--)
            if (filteredRequesters[i].isDisabled == 1)
                filteredRequesters.splice(i, 1);
                // this._productService.getRequestersByFirsterLetter('a')
                // .subscribe(products => {
                //     this.products = products;
                //     this.filteredRequesters = this.products;
                // },
                // error => this.errorMessage = <any>error);
    }
    else alert("Only one parent allowed. ")       
}

Answer 1

如果您不想添加表单，那么至少可以将ngModel添加到select元素以将其值绑定到属性然后重置它。然后你不需要进行后退（改变），它必须受到约束。如下所示：

selectedValues

其中reset(){ this.selectedValues=["ignore","ignore","ignore"]; }是该属性。然后您可以轻松重置其值：

this.reset()

通过按钮点击方式调用// Draw img2 on top of img1 at (x1,y1) img1.draw_image(x1,y1,img2);。

简化demo

单击按钮后将下拉菜单重置为默认值

1 个答案: