如果一个属性存在于angarjs中,显示它的所有对象和过滤器

Display all object, filter on a property if it exists in AnguarJS

本文关键字:显示 过滤器 对象 angarjs 一个 存在 属性 如果      更新时间:2023-09-26

我的问题是:

我有一个通过调用API填充的课程列表,并显示结果列表。您可以按主题或关键字筛选每个课程。

一组课程所属具有一个名为"Path"的属性,而不是所有课程都具有该属性。

在API中,我可以为值"Path"分配1、2、3、4或Null。下面的代码允许我使用Path属性筛选课程。

<div class="checkbox" ng-repeat="course in ds.courseList | unique:'course_path'">
<label><input type="checkbox" ng-model="ds.searchPath" ng-true-value="{$course.course_path$}" ng-false-value="">{$course.course_path$}</label>
</div>

所以真正的问题是,AngularJS正在挑选Null值,并将其显示为一个没有标签的复选框,或者(稍微调整一下)不显示任何课程,除非它有一个path属性。

我怎样才能显示所有的课程,不管它们的path属性是1、2、3、4还是Null,而不让Angular显示空复选框?

所有的课程都有多个属性,并且有三个搜索字段:关键字(搜索标题),主题和路径。在Path搜索中,有一个由AngularJS生成的复选框列表,它为Path中的每个唯一值显示一个复选框;1、2、3、4或Null。我遇到的问题是,我为隐藏Null值所做的一切,也过滤掉了列表中具有Null路径值的所有课程。如果Path != null

TL;DR:我想隐藏复选框的值为Null,而不隐藏课程列表中Path值为Null的课程

使用ng-if不包含没有路径的复选框

<div class="checkbox" 
     ng-repeat="course in ds.courseList | unique:'course_path'"
     ng-if="course.course_path">

使用

<div class="checkbox" ng-repeat="course in courseList ">
<label><input type="checkbox" ng-model="ds.searchPath" ng-show="{{course['course_path']}}">{{course['course_path']}}</label>
</div>
</div>

Codepen-http://codepen.io/nagasai/钢笔/XKpJxV