Question

正如我在主题中提到的，我尝试从下拉列表中选择依赖复选框。我将数据从控制器填充到我的下拉列表中：

 @RequestMapping(value = "/all", method = GET)
 public List<Warehouse> findAll(){
 return warehouseService.findAll();
 }

 $http
    .get('/api/warehouses/all')
    .then(function (response) {
        $scope.warehouses = response.data;
    });

每个Warehouse对象都有一个带包的List：

@OneToMany
private List<Package> packages = new ArrayList<>();

现在，当我创建Route时，当我从下拉列表中选择一个仓库时，我想从当前所选仓库的List中填充复选框。

选择仓库：

   <select ng-model="credentials.warehouseStart">
    <option ng-selected="credentials.warehouseStart == x" id="startId" ng-value="x" ng-repeat="x in warehouse" >{{x.name}}</option>
</select>

和复选框：

   <div flex-xs flex="50">
    <md-checkbox aria-label="Select All"
                 ng-checked="isChecked()"
                 md-indeterminate="isIndeterminate()"
                 ng-click="toggleAll()">
        <span ng-if="isChecked()">Un-</span>Select All
    </md-checkbox>
</div>
<div class="demo-select-all-checkboxes" ng-model="credentials.packages" flex="100" ng-repeat="item in packages">
    <md-checkbox ng-checked="exists(item, selected)" ng-click="toggle(item, selected)">
        {{ item.name }}    <p> </p>
        {{ item.user.firstName }}    {{ item.user.lastName }}
    </md-checkbox>
</div>

复选框填写：

  $http
    .get('/api/package/all')
    .then(function (response) {
        $scope.packages = response.data;
    });

如果我在Dropdowlist（仓库）中选择一个对象，我可以获得一个对象ID吗？然后我想我可以通过指令/ package / all / {id}获得正确的chebkoxes？

Answer 1

我根据您的评论回答每个仓库都有一个包列表。也就是说，我希望软件包能够成为您对 / api / warehouses / all 的GET调用的一部分。

首先，我会将您的仓库选择更改为使用ngOptions：

  <select ng-model="selected.warehouse"
          ng-options="x.name for x in warehouses"></select>

然后，列出包：

<div ng-model="selected.packages"
     ng-repeat="item in selected.warehouse.packages">

  <input type="checkbox"
         ng-checked="exists(item, selected)"
         ng-click="toggle(item, selected)"> {{ item.name }}
  <p> </p>
  {{ item.firstName }} {{ item.user.lastName }}
</div>

我创建了一个示例here。在内部，我使用ngIf在你的ui中的包列表中添加了几个包装器，但这不是必需的，但是你可能会根据是否进行选择来显示一个视图区域。

AngularJS - 复选框和下拉列表

1 个答案: