当我在选择

时间:2017-08-16 21:34:38

标签: angularjs json ui-select

我正在使用一个JSON文件,我把值放在一个选择的倍数,我试图标记一个复选框,当我在选择中选择一个值,但我不知道我该怎么做

这是我的JSON文件

 "tipocasa": [
        {"tipo":"Propia" , "tipo_casa":1},
        {"tipo":"Rentada" , "tipo_casa":2},
        {"tipo":"Otro" , "tipo_casa":3}
    ]

这是使用ui-select

的选择代码
          <ui-select multiple ng-model="entrevistainicialModel.idcomportamiento"
                           ng-disabled="false"
                           search-enabled="true"
                           append-to-body="true"
                           class="form-control ">
                    <ui-select-match placeholder="Comportamientos">
                        {{$item.comportamiento}}
                    </ui-select-match>
                    <ui-select-choices repeat="multipleItem.idcomportamiento as multipleItem in datosJson[0].comportamientos | filter: $select.search">
                        {{multipleItem.comportamiento}}
                    </ui-select-choices>
                </ui-select>

这是复选框代码

         <label class="checkbox-inline custom-checkbox nowrap">
            <input align="center" type="checkbox" ng-model="entrevistainicialModel.idcomportamiento" value="1">
                            <span align="center">Propia</span>
                        </label>

             <label class="checkbox-inline custom-checkbox nowrap">
            <input align="center" type="checkbox" ng-model="entrevistainicialModel.idcomportamiento" value="1">
                            <span align="center">rentada</span>
                        </label>

         <label class="checkbox-inline custom-checkbox nowrap">
            <input align="center" type="checkbox" ng-model="entrevistainicialModel.idcomportamiento" value="1">
                            <span align="center">Otro</span>
                        </label>

有任何想法或建议吗?

1 个答案:

答案 0 :(得分:0)

首先需要添加on-removeon-select来更改模型。 并且asign。根据您的需要,每个复选框。

我根据你的数据做了一个例子。

<强> HTML

    <ui-select multiple ng-model="data.selected" on-remove="$item.selected=false" on-select="$item.selected = true" theme="bootstrap" sortable="true" close-on-select="false" style="width: 800px;">
    <ui-select-match placeholder="Comportamientos...">{{$item.name}}</ui-select-match>
    <ui-select-choices repeat="comportamiento in datosJson.comportamientos">
  {{comportamiento.name}}
    </ui-select-choices>
  </ui-select>              
  <p>Selected: {{data.selected}}</p>

  <div ng-repeat="item in datosJson.comportamientos">
    <input type="checkbox" ng-model="item.selected">{{item.name}}
    <br>
  </div>

<强> CONTROLLER

$scope.datosJson = {
comportamientos:
  [
    {id:1, name:'comportamiento1'},
    {id:2, name:'comportamiento2'},
    {id:3, name:'comportamiento3'}
  ]
  };

这里是DEMO的plnkr 只需更改您的数据。