简单的多项选择 ng-selected 数组不起作用
simple multiple selection ng-selected with array not working
这是我的类别列表
$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 多个产品。
{{category.category_name}}
现在假设我添加了一个产品,分别有 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 与数组或多个值?
您忘记在代码中写入 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>
我已添加
$注意多项选择。
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
,多选。进行此更改后对我有用。
我有一个解决方案,使用 $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
希望对您有所帮助!
这是我的类别列表
$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 与数组或多个值?
您忘记在代码中写入 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>
我已添加 $注意多项选择。
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
,多选。进行此更改后对我有用。
我有一个解决方案,使用 $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
希望对您有所帮助!