简单的多项选择 ng-selected 数组不起作用

Question

这是我的类别列表

$scope.categories=  [{"category_id":"1","category_name":"sports"},{"category_id":"2","category_name":"casual"},{"category_id"
    :"3","category_name":"formal"},{"category_id":"4","category_name":"party wear"},{"category_id":"5","category_name"
    :"winter"},{"category_id":"9","category_name":"summer"}]

产品可以有多个类别。

$scope.product_categories=[{"category_id":"3"},{"category_id":"4"},{"category_id":"5"}]

我有这两个数组第一个数组 categories 包含所有类别。第二个数组包含该产品的类别。我有 select 标签，其中在添加 product.user 时列出了所有类别，可以 select 多个产品。

现在假设我添加了一个产品，分别有 3 个类别 3、4、5。

当我尝试编辑该产品时，必须 select 编辑这些 3、4、5 类别，因为该产品与这些类别相关。所以这是我的代码，它不起作用。

<select multiple="" class="form-control" name="category_list[]"  ng-model="categories"  >                
 <option ng-selected="{{category.category_id == product_categories}}"
    ng-repeat="category in categories"
    value="{{category.category_id}}">
    {{category.category_name}}
 </option>

我很困惑，当我有 array.Categories 的数组时，如何执行多个 selection 3,4,5 必须在 category.if 中进行 selected我会做 ng-selected="{{category.category_id ==5}}" 像这样只有 5 个类别是 get selected.how 做多个 selection 与数组或多个值?

Answer 1

您忘记在代码中写入 ng-app="" ... 像这样的东西！

<div ng-app="">
<select multiple="" class="form-control" name="category_list[]"  ng-model="categories"  >                
 <option ng-selected="{{category.category_id == product_categories}}"
    ng-repeat="category in categories"
    value="{{category.category_id}}">
    {{category.category_name}}
 </option>
  </div>

Answer 2

我已添加 $注意多项选择。

angular.module("myApp.controllers",[])
        .controller("product",function($scope){
    $scope.categories=  [{"category_id":"1","category_name":"sports"},{"category_id":"2","category_name":"casual"},{"category_id"
        :"3","category_name":"formal"},{"category_id":"4","category_name":"party wear"},{"category_id":"5","category_name"
        :"winter"},{"category_id":"9","category_name":"summer"}]

    $scope.product_categories=[{"category_id":"3"},{"category_id":"4"},{"category_id":"5"}] 

$scope.$watch('product_categories', function(nowSelected){

        $scope.selectedValues = [];

        if( ! nowSelected ){

            return;
        }
        angular.forEach(nowSelected, function(val){
            $scope.selectedValues.push( val.category_id.toString() );
        });
    });
        }); 

        });

并且我在视图部分做了一些修改

<select  class="form-control" name="category_list[]"  multiple ng-model="selectedValues"  >                
       <option ng-repeat="category in categories"
            value="{{category.category_id}}">
             {{category.category_name}}
        </option>
</select>

我把所有的分类都放在selectedValues里，然后赋值给select标签为ng model，多选。进行此更改后对我有用。

Answer 3

我有一个解决方案，使用 $scope.$watch

 $scope.$watch('product_categories', function (nowSelected) {
        $scope.selectedValues = [];

        if (!nowSelected) {
            // here we've initialized selected already
            // but sometimes that's not the case
            // then we get null or undefined
            return;
        }
        angular.forEach(nowSelected, function (val) {
            $scope.selectedValues.push(val.category_id.toString());
        });
    });

并通过以下方式应用 selectedValues：

<select multiple ng-model="selectedValues" style="width: 50%;" size="7">
        <option ng-repeat="category in categories" value="{{category.category_id}}" ng-selected="{{selectedValues.indexOf(category.category_id.toString())!=-1}}">{{category.category_name}}</option>
    </select>

==> Plunker 的完整代码 multi selection ng-selected

希望对您有所帮助！

简单的多项选择 ng-selected 数组不起作用

simple multiple selection ng-selected with array not working

php

arrays

angularjs

angularjs-select