Question

我的控制器中有以下数据：

$scope.breeds = ["Poodle", "Collie", "German shepherd"];

$scope.dogs = [
        { name: "Bingo", breed: "Poodle" },
        { name: "Lassie", breed: "Collie" },
        { name: "Bert", breed: "German shepherd" },
        { name: "Lily", breed: "Poodle" },
        { name: "Obi-Wan", breed: "Collie" }
    ];

这是我的HTML：

<select ng-model="query.breed" ng-options="breed for breed in breeds">                                    
    <option value="">All breeds</option>
 </select>

   <table>
        <thead>
            <tr>
                <th>Name</th>
                <th>Breed</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="dog in dogs |filter:query">
                <td>{{dog.name}}</td>
                <td>{{dog.breed}}</td>
            </tr>
        </tbody>
    </table>

一切正常 - 当我选择Collie时，会显示品种为==“Collie”的物品，等等。但我无法弄清楚如何使“所有品种”选项有效。

Answer 1

使用ngOptions时，value=""会将模型设置为与null不兼容的filter。你可以只使用ngRepeat。

<select ng-model="query.breed">
    <option value="">All breeds</option>
    <option ng-repeat="breed in breeds" value="{{breed}}">{{breed}}</option>
</select>

在Angular JS中，使用带有ng-options的select作为过滤器。如何创建一个＆＃34; all＆＃34;选项？

1 个答案: