Question

我的对象包含带有models的移动品牌。我在这里包含了我的对象

angular.module('myApp', [])
    .controller("myCntrl", function ($scope) {

$scope.items= [{


    id: "986745",
    brandname: "Nokia",
    modelname: "Lumia 735 TS"

}, {

    id: "896785",
    brandname: "Nokia",
    modelname: "Nokia Asha 230"
}, {

    id: "546785",
    brandname: "Nokia",
    modelname: "Lumia 510"
},
{

    id: "144745",
    brandname: "Samsung",
    modelname: "Galaxy Trend 840"
},

{

    id: "986980",
    brandname: "Samsung",
    modelname: "Galaxy A5"
},
{

    id: "586980",
    brandname: "Samsung",
    modelname: "Galaxy Note 4 Duos"
},
{

    id: "986980",
    brandname: "Samsung",
    modelname: "Galaxy A5"
},
{

    id: "586980",
    brandname: "Samsung",
    modelname: "Galaxy Note Duos"
},

{

    id: "232980",
    brandname: "Htc",
    modelname: "Htc One X9"
},
{

    id: "456798",
    brandname: "Htc",
    modelname: "Desire 820"
},
{

    id: "656798",
    brandname: "Htc",
    modelname: "Desire 810S"
}

]

}）

我的期望：在这里，我有3个移动品牌与各自的型号。当我来到这个页面，它应该显示3个复选框（下面我给出）

诺基亚
三星
HTC

如果我点击诺基亚，那么它应该显示带有复选框的诺基亚手机型号喜欢（带复选框的列表）

Lumia 735 TS
诺基亚Asha 230
Lumia 510

如果我点击三星或Htc，那么它应该显示各自的模型，如诺基亚

当我提交时我应该只检查复选框值brandname和modelname任何人帮助我

Answer 1

创建一个过滤唯一值的过滤器。

AngularJs Remove duplicate elements in ng-repeat

如果您将品牌名称放在一个单独的数组中会更好。无论如何。使用该过滤器创建复选框。如果您选中/取消选中该复选框，则每个复选框都会有一个单独的ng-change。在支票上，您将品牌名称推送到具有所选品牌名称的数组。取消选中后，您将从该阵列中删除品牌名称。

奥基。所以现在我们在阵列中选择了我们的品牌名称。接下来，您将在html中添加嵌套ng-repeat。第一个ng-repeat将迭代所选的品牌名称，第二个ng-repeat将迭代items数组。在第二个ng-repeat中，您将ng-if通过将当前商品品牌名称与当前母品牌名称进行比较来过滤模型。

示例嵌套ng-repeat html：

<div ng-repeat="brand in selectedBrands">
  <div ng-repeat="item in items" ng-if="item.brandname === brand">
    // checkboxes and stuff here
  </div>
</div>

稍后如果我有时间，如果您仍然无法自己编写代码，我可能会发布更多代码;）

修改

我想出了一些快速的事情：JSFiddle

希望有所帮助：P

如何基于复选框检查制作chckbox列表并使用angularjs取消选中？

1 个答案: