首页 > angularjs > 如何使用AngularJs在bootstrap selectepicker multiple中设置选定的值?

如何使用AngularJs在bootstrap selectepicker multiple中设置选定的值? (How to set selected values in bootstrap selectepicker multiple with AngularJs?)

问题

我正在使用bootstrap selectpicker,我无法设置要选择的值。我试着在他的数组值中设置模型名称,但它不能令人遗憾地工作。

<select
    class="form-control"
    name="groupCustomer"
    title='Choose'
    id="tags" multiple data-multiple-separator=" " data-max-options="3"
    ng-model="moreDetailsData.groupCustomer">

    <option ng-repeat="grp in groupCustomer" value="{{grp.id}}" data-content="<span class='label ' style='background:{{grp.group_color}}'>{{grp.group_name}}</span>">

            </option>
 </select>

致电功能:

<script type="text/javascript">
    $(function() {
        $('#tags').selectpicker('val','[1,2]');
    }); 
</script>

角度:

$scope.groupCustomer = [
{"id" : 1,"name" : "group 1"},
 { "id" : 2, "name" : "group 2"},
 {"id" : 3,"name" : "group 3" },
 {"id" : 4,"name" : "group 4" }]

$scope.moreDetailsData.groupCustomer = [1,2,3];

我该怎么办才能修好它?

解决方法

试试这个 :

 $timeout(function () {          
            $('#tags').selectpicker();
$('#tags').selectpicker('val',$scope.moreDetailsData.groupCustomer).trigger("change"); 
        });

看到这个链接:https//jsfiddle.net/n57ekstu/18/

问题

I am using bootstrap selectpicker and I cant set values to be selected. I have try to set the model name in his values of array, but it doesn't work sadly.

<select
    class="form-control"
    name="groupCustomer"
    title='Choose'
    id="tags" multiple data-multiple-separator=" " data-max-options="3"
    ng-model="moreDetailsData.groupCustomer">

    <option ng-repeat="grp in groupCustomer" value="{{grp.id}}" data-content="<span class='label ' style='background:{{grp.group_color}}'>{{grp.group_name}}</span>">

            </option>
 </select>

Call To the function:

<script type="text/javascript">
    $(function() {
        $('#tags').selectpicker('val','[1,2]');
    }); 
</script>

Angular:

$scope.groupCustomer = [
{"id" : 1,"name" : "group 1"},
 { "id" : 2, "name" : "group 2"},
 {"id" : 3,"name" : "group 3" },
 {"id" : 4,"name" : "group 4" }]

$scope.moreDetailsData.groupCustomer = [1,2,3];

What could I do to get it fixed?

解决方法

try this :

 $timeout(function () {          
            $('#tags').selectpicker();
$('#tags').selectpicker('val',$scope.moreDetailsData.groupCustomer).trigger("change"); 
        });

See this link : https://jsfiddle.net/n57ekstu/18/

相似信息