Question

我想使用AngularJS（版本：1.6.6）建立购物网站

我使用“ checklist-model”和“ angularUtils.directivces.dirPagination”指令进行开发。

我正面临一个问题，我想创建一个具有类别功能的产品列表。例如，产品将分为三类（Cat-A，Cat-B和Cat-C）。

我使用checklist-model实现了三个复选框，它们具有三个类别的值，但是，如何根据选中的复选框过滤产品列表？

示例：如果选中“ Cat-A”和“ Cat-B”，则结果将滤除所有无关产品（即Cat-C产品）

这是我的一些编码：

<div class="col-12 col-lg-4" dir-paginate="item in datas|filter:select.types|itemsPerPage:3">
    <div>
         <!--The product details-->
    </div>
</div>

以下是有关类别复选框的信息：

<div>Type</div>
       <hr>
<div ng-repeat="t in type">
       <label style="font-size: 0.9vw;padding-left: 1vw;">
           <input type="checkbox" checklist-model="select.types" checklist-value="t"> {{t}}
       </label>
</div>

<script>
$scope.select={
    targets:[],
    types:[]
};
</script>

数据示例：

[{"id":"22","p_name":"P3","p_cat":"Cat-C","p_detail":"--","p_price":"333","image":"5bf7f65e8818f.png","created":"2018-11-23 12:45:18","modified":"2018-11-23 12:45:18"},{"id":"24","p_name":"P2","p_cat":"Cat-B","p_detail":"--","p_price":"123","image":"5bfa20ad35a7d.PNG","created":"2018-11-25 04:10:21","modified":"2018-11-25 04:10:21"},{"id":"25","p_name":"P1","p_cat":"Cat-A","p_detail":"--","p_price":"1","image":"5bfa20b7c1c48.PNG","created":"2018-11-25 04:10:31","modified":"2018-11-25 04:10:31"}]

很抱歉解释不正确。希望有人能帮助我！

通过使用“清单模型”和“ dirPagination”创建购物清单

0 个答案: