AngularJS删除空值 [英] AngularJS remove empty value

问题描述

我试图实现的：

而不显示空（NULL）值从数组中的每个值列表。

例如编号1，编号1，编号2

当前存在的问题：
我试过几个过滤器TODO这个任务，但我不能删除空列表项（见图表）。

感谢您事先的任何援助/帮助。

控制器JS：

  $ scope.array = [编号1，项目＃1，，，，项目2];
 

HTML：

 ＆LT; MD-列表＆gt;
    ＆LT;＆GT MD-列表项类=MD-三线NG重复=$通过在指数跟踪阵列项;
        ＆LT; D​​IV CLASS =MD-列表项文本＆GT;
            ＆LT; P＆GT; {{}项}＆LT; / P＆GT;
        ＆LT; / DIV＆GT;
        ＆LT; MD-分NG-IF =！$最后一个＆GT;＆LT; / MD分压器＆GT;
    ＆LT; / MD-列表项＆GT;
＆LT; / MD-列表＆gt;
 

视觉：

解决方案

您可以简单地添加自定义过滤器和应用程序中的任何地方使用它。这是一个很好的解决方案，因为标准过滤器的行为不同取决于angularJS的版本。在code会是这样的：

\r

\r

.filter（'emptyFilter'，函数（）{\r
  复位功能（阵列）{\r
    变种filteredArray = [];\r
      angular.forEach（阵列功能（项目）{\r
        如果（项目）filteredArray.push（项目）;\r
      }）;\r
    返回filteredArray;\r
  };\r
}

\r

＆LT; UL＆GT;\r
  ＆LT;李NG重复=，在数组项| emptyFilter＆GT;\r
    ＆LT; P＆GT; {{}项}＆LT; / P＆GT;\r
  ＆LT; /李＆GT;\r
＆LT; / UL＆GT;

\r

\r

\r

What I'm trying to achieve:
List each value from an array without displaying the empty (Null) value.

e.g Item #1, Item #1, Item #2

Current Problems: I've tried several filters todo this task, but I can't remove the empty list item (see diagram).

Thank you in advance for any assistance/help.

Controller JS:

$scope.array = ["Item #1","Item #1","","","","Item #2"];

HTML:

<md-list>
    <md-list-item class="md-3-line" ng-repeat="item in array track by $index">
        <div class="md-list-item-text">
            <p>{{item}}</p>
        </div>
        <md-divider ng-if="!$last"></md-divider>
    </md-list-item>
</md-list>

Visual:

解决方案

You can simply add your custom filter and use it everywhere in application. It is a good solution since standard filter's behavior differs dependent on the version of angularJS. The code would be like that:

.filter('emptyFilter', function() {
  return function(array) {
    var filteredArray = [];
      angular.forEach(array, function(item) {
        if (item) filteredArray.push(item);
      });
    return filteredArray;  
  };
}

<ul>
  <li ng-repeat="item in array | emptyFilter">
    <p>{{item}}</p>
  </li>
</ul>

这篇关于AngularJS删除空值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！