Question

我正在开发简单的离子应用程序，其中有一个显示手机型号的表格，我有下拉列表根据选择的选项过滤表格我这样做但我不知道为什么我不工作。

 <div class="list list-inset">
        <label class="item item-input">
            <i class="icon ion-search placeholder-icon">
            </i>
            <input ng-model="searchValue" placeholder="Search" type="text">
            </input>
        </label>
        <label class="item item-input item-select">
            <div class="input-label">
                brand
            </div>
            <select ng-model="chosenBrand">
                <option>
                    Nokia
                </option>
                <option selected="">
                    Samsung
                </option>
                <option>
                    Apple
                </option>
                <option>
                    Sony
                </option>
            </select>
        </label>
    </div>
    <div class="row header">
        <div class="col table-colmun">
            <h5>
                Brand
            </h5>
        </div>
        <div class="col table-colmun">
            <h5>
                Model
            </h5>
        </div>
        <div class="col table-colmun">
            <h5>
                Year
            </h5>
        </div>
    </div>
    <div class="row" ng-repeat="mobile in mobilesArray |filter:chosenBrand" ng-click="selectItem(mobile, $index)" ng-class="{'selected':$index == selectedRow}">
        <div class="col table-colmun">
            {{mobile.brand}}
        </div>
        <div class="col table-colmun">
            {{mobile.model}}
        </div>
        <div class="col table-colmun">
            {{mobile.year}}
        </div>
    </div>

当我选择一个选项时，它会给我一张空白表，其中包含现在的数据，但是当我在视图中写{{chosenBrand}}时，它会显示所选的选项。

Answer 1

正如所指出的，你需要有一个选项值。

也可以使用ng-options指令而不是手动使用这些选项。

~~喜欢这个<select ng-options="brand.brandName for brand in brands" ng-model="chosenBrand"></select>~~

使用像

这样的品牌数组

[
    {brandId:1,brandName:'Nokia'},
    {brandId:2,brandName:'Apple'},   
    {brandId:3,brandName:'Samsung'},
    {brandId:4,brandName:'Sony'},       
]

--- --- EDIT 因此，当您使用ng-options时，因为选项具有值1,2,3等等。而是使用这个

<select ng-options="brand.brandName as brand.brandName for brand in brands" ng-model="chosenBrand"></select>

检查out this fiddle

根据选择选项进行过滤

1 个答案: