Question

我有一个带有多个选项的选择器和一个重置按钮，单击该按钮时必须将选择器重置为第一个选项。

单击按钮时重置选择器，但表中的数据不会更改。

这些是选择器和按钮：

<select ng-model="$ctrl.type">
    <option value="">First option</option>
    <option value="Second option">Second option</option>
    <option value="Third option">Third option</option>
</select>

<div class="btn action-btn" ng-click="$ctrl.doReset()">
    Reset options
</div>

选择器过滤表格中的数据：

<tbody>
    <tr ng-repeat="rows in $ctrl.myData | filter: {Type:type} track by $index">
        <td>
            <span>{{rows.Type}}</span>
        </td>
        <td>
            <span ng-repeat="row in rows.Parameters track by $index">{{rows.Parameters[$index]}}</span>
        </td>
        <td>
            {{rows.OccuranceDate}}
        </td>
    </tr>
</tbody>

选择器，按钮和表格都在同一个html页面中。

在控制器中我有这个：

class MyCtrl {
    constructor(MyService, $stateParams) {
        this.MyService = MyService;
        this.loading = true;
        ...

    }
    $onInit() {
        ...
    }
    ...

    doReset() {
        this.type = "";
    }
}

第一个选项的值为""，这是我尝试在doReset()中执行的操作，它将选择器中的选项重置为第一个但不是表中的数据。我想重置表格数据。

知道什么是错的吗？

Answer 1

你的问题在于你的过滤变量，你的过滤器是filter: {Type: type}但它应该绑定到$ scope（$ ctrl）变量，如下所示：filter: {Type: $ctrl.type}

请参阅示例here

重置选择器不会正确重置表数据

1 个答案: