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

在您的控制器中，只需将$scope.user.country设置为名称等于$scope.$parent.user.country的选项。

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

请注意，过滤器会返回一个数组，因此请确保只获取第一个项目。

Answer 2

你们中的任何一个红色文档??

<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>

纳克选定=＆＃39;选择＆＃39; ＆lt; - 在撇号中选择的单词指向$ 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 PART：

        .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

Answer 3

经过一些测试后，我找到了一个有效的解决方案，我设法以@ 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 4

你可以这样做

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

它应该可行

根据字符串预先选择select中的选项

4 个答案: