Ui-select ng-model没有绑定到selected

Question

我试图做一个简单的下拉菜单，在它的搜索。我无法在这个下拉菜单上更改ng-model。这就是我所做的，正如你所看到的，它非常简单(主要是从开始复制粘贴)

我找不到关于$select的任何信息。问题是因为我没有把这个添加到ng模型中吗?如果是，我应该在控制器

中添加什么?

<div class="form-group">
<label class="col-md-1">Investigation type<font color="red"><b>*</b></font></label>
    <div class="col-md-3">
        <ui-select ng-model="investigationType" ng-change="someFunc()" theme="bootstrap">
        <ui-select-match placeholder="Select or search a contries in the list...">
            <span>{{$select.selected.name}}</span>
        </ui-select-match>
            <ui-select-choices repeat="item in contries | filter: $select.search">
               <div ng-bind-html="item.name | highlight: $select.search"></div>
            </ui-select-choices>
        </ui-select>
    </div>
</div>
{{investigationType}}

，你可以看到，非常简单的东西，虽然选择后，我没有看到任何页面上。什么错了吗?

app.controller('investigationCtrl', ['$scope', '$http', function ($scope, $http) {
    $scope.investigationType ="";
    $scope.toolShow=false;
    $scope.someFunc = function () {
        $scope.investigationType == "Alabama")
            $scope.toolShow = true;
        else
            $scope.toolShow = false;
    }
    $scope.contries = [
        { id: 1, name: "Alabama" },
        { id: 2, name: "Alaska" },
        { id: 3, name: "Arizona" },
        { id: 4, name: "Arkansas" }];
}]);

Answer 1

您需要ng-model来保存所选对象，而不是字符串。

重写为ng-model="contries.selected"(而contries是您的数据数组)。

然后将{{contries.selected}}添加到模板中，您将看到所选对象的序列化，因此只需使用contries.selected.name来访问项目名称。

这是一个工作的plunk

你也可以这样做

ng-change="someFunc($select.selected)"

要从回调中访问选定的对象，则可以避免混淆ng-model。