Question

我有以下选择填充了世界上所有国家/地区，我有一个Angularjs控制器调用一个方法，该方法返回idCountry其中一个变量为idCountry的国家/地区的idCountry对象的id，而不是对象在select中占据的位置的索引。

我需要使用track by在select中预先选择该国家/地区，有没有办法使用对象的id获取此对象在select中的索引，我读了一些文章说这可以使用ng-options表达式中的$scope.countriesSelect = $scope.countriesSelect[put here the select index that I can find]完成，但我不知道如何。

如果我设法获得索引，我可以预先选择像这样的选项

<select name="selectCountries" class="form-control" 
                                        id="selectCountries" 
                                        ng-model="selectCountries"
                                        ng-options="country.name for country in countryList track by country.idCountry" 
                                        ng-change=""
required>
</select>

这是我的选择

var idCountry = id;
$scope.selectCountries= $scope.selectCountries[idCountry]

这就是我在控制器中尝试做的事情

[{idCountry: 2, name: countryName}, {idCountry: 4, name: AnothercountryName}, {idCountry: 7, name: rockyCOuntry}]

修改

我编辑了我的代码，我已经阅读了类似的问题，但大多数问题是关于如何使用默认值初始化选择，我正在尝试编辑页面，用户可以检查他放置的所有值在他注册期间，他可以编辑它们，这个选择需要用他选择的值进行初始化。

我可以获取对象列表中任何对象的id

这是填充我的选择

的对象列表

idCountry

我有一个方法可以返回idCountry，我想知道是否有办法使用此ng-options获取选择的索引或者在我的track by表达式中添加一些表达式，例如使用$scope.selectCountries= $scope.selectCountries[idCountry]或其他内容。

我试过这个7 但是如果我放IComparer(Of Foo)而不是在rockyCOuntry中设置select而在另一个国家/地区设置选择，这不会返回正确的国家/地区，我相信这是因为列表对象的ID与占据该对象的select的相同索引。

Answer 1

好吧，请注意，object实际上是countryId，因此您无法直接设置<option>的{{1}}。要实现您的目标，因为您已经拥有id，您必须在控制器中执行以下操作：

var selectedId = 7; // Just an example

$scope.selectCountries = { "idCountry": selectedId };

另一方面，如果您不想在object中设置整个ngModel，只需idCountry（我不推荐），您可以执行以下操作：

$scope.selectCountries = 7; // Just an example

<select name="selectCountries" class="form-control" id="selectCountries" ng-model="selectCountries" ng-options="country.idCountry as country.name for country in countryList" required>
 </select>

<强>演示：

(function() {
  "use strict";
  angular.module('app', [])
    .controller('mainCtrl', function($scope) {
      $scope.countryList = [  
         {  
            "idCountry":2,
            "name":"countryName"
         },
         {  
            "idCountry":4,
            "name":"AnothercountryName"
         },
         {  
            "idCountry":7,
            "name":"rockyCOuntry"
         }
      ];

      $scope.selectCountries = {
        "idCountry": 7
      };
      // $scope.selectCountries = 7;
    });
})();

<!DOCTYPE html>
<html ng-app="app">

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script>
</head>

<body ng-controller="mainCtrl">
  <select name="selectCountries" class="form-control" id="selectCountries.id" ng-model="selectCountries" ng-options="country.name for country in countryList track by country.idCountry" required>
  </select>
  <pre ng-bind="selectCountries | json"></pre>
</body>

</html>

注意：两种方式都能为您提供预期的结果。

我希望它有所帮助。

如何预先选择Angularjs中的选择选项填充ng-options

1 个答案: