Question

我希望输入中的值过滤下拉列表中的值，并且对于具有$ index == 0的选项，ng-selected为true。

当过滤器执行操作时，ng-selected中的值将更改为true，并且元素上的selected属性不会更改为selected =＆＃34; selected＆＃34;。如果我删除模型，它将按预期工作。

<div ng-app ng-controller="AppCtrl" ng-init="sigStyles.companies = ['facebook', 'twitter', 'tumblr', 'myspace']">

    <input type="text" ng-model="socialSearch"></input>

    <select>
        <option ng-repeat="company in sigStyles.companies | filter:socialSearch" value="{{company}}" ng-selected="{{$index === 0}}">{{company}}</option>
    </select>

</div>

有人知道如何更改所选属性，或者有人知道如何根据输入从搜索中删除选项吗？

链接到我的小提琴here。

Answer 1

所以上面的答案是正确的，如果不是一点点冗长。我不建议使用手表因为我觉得它有点麻烦。所以基本上就是我想出来的内容（如果我错过了一些内容，请随时告诉我，但请记住我正在努力帮助:-) Plnkr 这个我忘了列入列表但是可以包括在内像第二个。

基本上JS看起来像这样......

angular.module('myApp', []);

function MainCtrl($scope) {
    $scope.options = ['as', 'b', 'c', 'a2'];
    $scope.opt1 = 0;  
    $scope.selectedOpt = $scope.options[0];
    $scope.setOption = function() {
        if($scope.options.indexOf($scope.inFilter)  > -1){
              $scope.selectedOpt = $scope.inFilter
        };
    }
}

设置选项只是检查文本是否存在，如果存在则设置值。

如果您希望在没有匹配项时显示消息，我可能会推荐更多like this。

希望这有帮助！

Answer 2

我们可以使用搜索模型作为过滤器的参数来创建一个过滤的新数组。该数组用于ng-select。监视搜索模型中的任何更改并用于更新已过滤的阵列。

<div ng-app="myapp">
    <div ng-controller="ctrlParent">
        <input type="text" ng-model="search" />
        <select ng-model="storedModel" ng-options="opt for opt in filteredArray | filter:search"></select>
    </div>
</div>

JS：

var app = angular.module('myapp',[]);
app.controller('ctrlParent',function($scope,filterFilter){
    $scope.list = ["facebook","twitter","tumblr","google"];
    $scope.filteredArray = $scope.list;
    $scope.storedModel = $scope.filteredArray[0];
    $scope.$watch('search',function(newValue){
       $scope.filteredArray = filterFilter($scope.list, newValue);
       $scope.storedModel = $scope.filteredArray[0];
    });    
});

工作解决方案的小提琴here。

ngSelected不在select元素中工作

2 个答案: