根據字符串預先選擇一個選項

Question

我一直在四處搜尋以查看indexOf是否存在某種等效函數，但對於使用ng-options的選擇框，但我一直未能找到答案。

基本上我想要做的是這樣的：

$scope.$parent.user.country = $scope.countries[0]; 

編輯：我用$parent因爲$scope.user對象住在父範圍，但選擇仍然可以訪問它。

但不是$scope.countries[0]我需要選擇選項，哪個對象的name屬性匹配來自數據庫的字符串。因此，如果$scope.$parent.user.country等於"Sweden"，則應該預先選擇此選項。

我該如何做到這一點？

這是從JSON片段將創建一個選擇框：

[ 
    {"name": "Sweden", "code": "SE"}, 
    {"name": "Switzerland", "code": "CH"}, 
    {"name": "Syrian Arab Republic", "code": "SY"} 
] 

這是選擇框：

<select ng-model="user.country" ng-options="country as country.name for country in countries"></select> 

Answer 1

所以一些測試後，我發現了有效的解決方案，我設法與@ sq1020的回答爲基礎，這樣做：

var index; 

$scope.$parent.user.country = $scope.countries[$scope.countries.map(function(country, i) { 

    if (country.name === $scope.$parent.user.country.name) { 
    index = i; 
    return i; 
    } 
})[index]]; 

Answer 2

你可以做這個

<select ng-model="user.country" ng-options="country.name as country.name for country in countries"></select>

它應該工作

Answer 3

在您的控制器中，只需將$scope.user.country設置爲名稱等於$scope.$parent.user.country的選項即可。

$scope.user.country = $scope.countries.filter(function(country) { 
    return country.name === $scope.$parent.user.country; 
})[0] 

請注意，過濾器會返回一個數組，所以請確保您剛剛獲得第一個項目。

Answer 4

你們中的任何一位紅色文檔？

<label>Check me to select: <input type="checkbox" ng-model="selected"></label><br/> 
<select aria-label="ngSelected demo"> 
    <option>Hello!</option> 
    <option id="greet" ng-selected="selected">Greetings!</option> 
</select> 

NG-選擇= '選擇' < - 字撇點選擇$ scope.selected。把你的選擇值放在那裏。

這裏有文檔鏈接：ngSelected

這裏有我的例子。 我給你帶來了我的整個JavaScript閱讀4從數據庫中選擇依賴於對方的選擇，在此之後，你會看到我的整個玉代碼的一部分。你可以用你的名字複製這個溶劑。

.controller('datatableRelationController', ['$scope', '$http', 
    function ($scope, $http) { 
     $scope.relations = []; 
     $scope.tables = []; 


     $scope.firstTableColumns = []; 
     $scope.secondTableColumns = []; 
     //display menu with tables 
     $http.get('/api/datatable/list/') 
      .success(function (json_data, status, headers, config) { 
       for (key in json_data) { 
        var fields = json_data[key]['fields']; 
        $scope.tables.push({name: fields['name']}); 
       } 
      }) 
      .error(function (data, status, headers, config) { 
       Materialize.toast("Błąd pobierania tabel", 2000); 
      }); 

     $scope.addRelation = function() { 
      var data = { 
       source_table: $scope.firstTable.name, 
       source_column: $scope.firstTableSelectedColumn.name, 
       dest_table: $scope.secondTable.name, 
       dest_column: $scope.secondTableSelectedColumn.name, 
       relation_type: 'normal' 
      }; 
      apiPOST('/api/relation/add/', data, $http) 
       .success(function (data, status, headers, config) { 
        Materialize.toast('Relacja dodana.', 2000); 
        $scope.relations = []; 
        $scope.tables = []; 


        $scope.firstTableColumns = []; 
        $scope.secondTableColumns = []; 
       }) 
       .error(function (data, status, headers, config) { 
        Materialize.toast('Błąd dodawania relacji.', 2000) 
       }); 
     }; 

     var getColumns = function (tableName, destination) { 
      $http.get('/api/worktable/fields/get/' + tableName) 
       .success(function (json_data, status, headers, config) { 
        var fields = json_data[0]; 
        for (key in fields) { 
         destination.push({name: fields[key]}); 
        } 
       }) 
       .error(function (data, status, headers, config) { 
        Materialize.toast("Błąd pobierania kolumn z tabeli", 2000); 
       }); 
     } 

     $scope.firstTableChange = function (firstTable) { 
      getColumns(firstTable.name, $scope.firstTableColumns); 
     }; 

     $scope.secondTableChange = function (secondTable) { 
      getColumns(secondTable.name, $scope.secondTableColumns); 
     }; 
    } 
]); 

JADE部分：

 .row 
      .col.l5.m6.s12.offset-l1 
       .form 
        .input-field 
         select.browser-default(ng-model="firstTable", ng-change="firstTableChange(firstTable)", ng-options="table.name for table in tables", material-select) 
          option(value="", disabled, ng-selected) Wybierz pierwszą tabelę 
       div(ng-show="firstTable || secondTable") 
        .form(ng-show="firstTable") 
         .input-field 
          select.browser-default(ng-model="firstTableSelectedColumn", ng-change="firstTableSelectedColumn", ng-options="column.name for column in firstTableColumns", required, material-select) 
      .col.l5.m6.s12 
       .form 
        .input-field 
         select.browser-default(ng-model="secondTable", ng-change="secondTableChange(secondTable)", ng-options="table.name for table in tables", material-select) 
          option(value="", disabled, ng-selected) Wybierz drugą tabelę 
       div(ng-show="firstTable || secondTable") 
        .form(ng-show="secondTable") 
         .input-field 
          select.browser-default(ng-model="secondTableSelectedColumn", ng-change="secondTableSelectedColumn", ng-options="column.name for column in secondTableColumns", required, ng-show="secondTable", material-select) 
     .row 
      .col.s12.center-align 
       button.btn.orange.lighten-2.weaves-effect.white-text(ng-click="addRelation()") Zastosuj