Question

我试图找出为什么我似乎无法解决简单的角度下拉重置问题。

当视图加载时，您点击按钮＆＃34;重置＆＃34;，它会根据控制器中的功能指示将所选的任何值更改为不同的值。这在页面加载时工作正常，但如果您更改下拉列表中的值，则单击＆＃34;重置＆＃34;，它什么都不做。它没有重置功能中指定的下拉列表，我无法弄清楚。

重现的步骤：

页面加载
点击＆＃34;重置＆＃34;按钮
下拉值更改为＆＃34;日语＆＃34;
将值更改回＆＃34;英语＆＃34;
点击＆＃34;重置＆＃34;按钮
无。它应该将值更改回英语，但不会。

我在Codepen中使用极其基本的离子示例将所有内容归结为最基本的示例：

http://codepen.io/starshock/pen/EPdXpz

基本上，这是我的控制器代码：

.controller('DropdownController', [ '$scope', '$state', function($scope, $state) {
        $scope.navTitle = 'Dropdown Reset';

        $scope.reset = function() {
          $scope.selectedOption = $scope.languages[0];
        }

        $scope.languages = [
          { name: "English"},
          { name: "Japanese"}
        ];
      $scope.selectedOption = $scope.languages[1];
    }]);

这是我的模板：

<script id="entry.html" type="text/ng-template">
    <ion-nav-bar animation="nav-title-slide-ios7"
                 type="bar-positive"
                 back-button-type="button-icon"
                 back-button-icon="ion-ios7-arrow-back">
    </ion-nav-bar>

    <ion-view title="{{navTitle}}" class="bubble-background">

        <ion-content has-header="true" padding="true">

            <div class="item item-input item-select" href="#">
      <label>
        <div class="input-label">
          Select language
        </div>
        <select
          data-ng-options="language.name for language in languages"
          data-ng-model="selectedOption">
        </select>
      </label>
    </div>
            <button class="button button-positive" ng-click="reset()">Reset</button>

        </ion-content>
    </ion-view>
</script>

我几个月来一直在努力解决这个问题，而且我有很多使用类似代码的实例。任何角度大师有什么想法吗？：d

Answer 1

您需要稍微更改控制器，以便每次引用同一个对象（请参阅https://stackoverflow.com/a/17607794/360067和引用的答案，即基础知识https://stackoverflow.com/a/14049482/360067。）

假设您想要的默认值是英语（如果它是日语，只需在两个地方将索引更改为1）

    $scope.reset = function() {
      $scope.filter.selectedOption = $scope.languages[0];
    }

    ...

    $scope.filter = {
      selectedOption: $scope.languages[0]
    };

并在您的HTML中

    <select
      data-ng-options="language.name for language in languages"
      data-ng-model="filter.selectedOption">
    </select>

CodePen - http://codepen.io/anon/pen/KVGqOG

在Ionic中重置Angular下拉选项 - 在值从初始值更改后不会重置

1 个答案: