AngularJS ng-repeat 默认值不起作用

Question

我正在使用 AngularJS，我在这方面很陌生。

我的目标是使用来自数据源的 OPTION 元素填充标签 SELECT。 我基本上就是这样做的：

<script>

    function LocalizationController($scope, $http) {
        $scope.Regions = [
            { ID: "001", DESC: "DESC_1" },
              { ID: "002", DESC: "DESC_2" },
                 { ID: "003", DESC: "DESC_3" },
                    { ID: "004", DESC: "DESC_4" },
        ];

        $scope.Region = "003";
        $scope.init = function () {
            $scope.Region = "003";
        }
    }
</script>


<div ng-controller="LocalizationController" ng-init="init();">
    <input type="button" ng-click="Region='002'" value="test">
    <select id="region" name="RegionCode" ng-model="Region">
        <option ng-repeat="item in Regions" value="{{item.ID}}">{{item.DESC}}</option>
    </select>
</div>

一切正常，Select 里面装满了我的物品， 但我想设置默认值。

你怎么看 - 我设置我的对象模型是 ng-model="Region" - 我通过 $scope.Region = "003" 将其默认值设置为 init() 函数； 加载 SELECT 时我不知道为什么，但默认值是第一个“001”

我还尝试通过手动更改值 在这种情况下，SELECT 会获得正确的值选择。

谁能解释为什么它不起作用？

我知道这是一个常见问题，我已经在寻找它， 使用 NG-OPTION 的任何解决方案建议，该指令效果很好， 它可以用我的对象数组填充我的 SELECT，它可以选择默认值， 非常好，但它不能解决我的问题，因为值 选项元素 id 是一个整数自动增量，这不是我想要的。

总结一下：

NG-REPEAT 可以呈现我想要的 SELECT 但默认值不起作用 NG-OPTIONS 可以按照我想要的方式呈现 SELECT，默认值有效，但值进入选项 无法按我的意愿设置项目。

有什么建议吗？

提前致谢

---

编辑

---

我找到了一个“解决方案”

<div ng-controller="LocalizationController" EXCLUDE-ng-init="init();"> 
     <select id="region" onload="alert();angular.element(this).scope().Region='002'"  name="RegionCode" ng-model="Region">
        <option ng-repeat="item in Regions" value="{{item.ID}}">{{item.DESC}}</option>
         {{init();}}
    </select>
</div>

我不太喜欢，但效果很好： - ng-init="init();"效果不好 - 如果我们将默认值的初始化排除在 ng-init 中，那么 EXCLUDE-ng-init="init();"并在选项被加载时放置 initilize 它可以工作

看看代码，我把 {{init();}} 放在 ng-repeat 之后。一切都很好 {{item.DESC}} {{init();}}

我不认为是最好的解决方案，但可行， 1）我的元素有一个下拉填充 2）我列表中的选项值是正确的，“001”，“002”，而不是一个无用的愚蠢的自动增量值。

我希望这可以帮助某人... 感谢所有试图帮助我的人

---

Answer 1

只需使用 ng-options

<select id="region" name="RegionCode" ng-model="Region" ng-options="option.ID as option.DESC for option in Regions">

然后做

$scope.init = function () {
    $scope.Region = $scope.Regions[2];
}

当您在使用ng-options 时检查选择框时，选项的值将类似于 0、1、2、3..，即如您所说的自动递增整数。但不要担心。它只是显示在那里的价值，但是一旦您发布表单，您将获得正确的价值，在您的情况下ID。

Answer 2

使用 ng-options

在这种情况下，如果你使用对象（不是单个值），它应该是这样

$scope.init = function () {
    $scope.Region = $scope.Regions[2];
}