1

我想使用 ng-hide 指令隐藏每个没有内容(简单文本)的标签。这就是我想要完成的事情:

<div class="menu-head" ng-hide="c1.section == ''">{{c1.section}}</div>

但这不起作用。但是,以下两个评估为 true(出于测试目的,我将 c1.section 字段设置为“Section 1”的值)并且相应的 div 变为隐藏:

<div class="menu-head" ng-hide="c1.section == c1.section">{{c1.section}}</div>
<div class="menu-head" ng-hide="c1.section == 'Section 1'">{{c1.section}}</div>

c1.section 可通过以下方式访问

<div ng-repeat="c1 in col1">

从这个控制器:

function MenuCtrl($scope) {
    "use strict";
    $scope.col1 = MenuData.col1;
    $scope.col2 = MenuData.col2;
    $scope.col3 = MenuData.col3;
}

对象 col1 可能包含或不包含字段“section”的位置。所以很明显,每当对象中缺少一个字段(任何字段)时,我希望它的 div 丢失/不显示在 DOM 中。这是 MenuData 对象:

var MenuData = {
    col1: [
        {section: 'Section 1'}, // <-here the fields id, name, price and descr are missing so their divs must not show up in the DOM.
        {
            id: '1',
//            section: 'Section 2', <- here the field section is missing (commented-out).
            name: 'Position 1',
            price: '2.50',
            descr: 'some description'
        },
        {section: 'Section 3'},
        {
            id: '2',
            section: 'Section 4',
            name: 'Position 2',
            price: '4.75',
            descr: ''
        }
    ]
};

当“c1.section”数据绑定中没有内容时,如何使 ng-hide 的表达式评估为“真”?

4

1 回答 1

7

您应该能够使用以下代码:

<div ng-hide="!c1.section">

这将隐藏div何时c1.section等于''c1对象没有section属性。

为了您的方便,我在http://plnkr.co/edit/aOe7Vc8lmYf43ODkCymx?p=preview创建了一个有效的 Plnkr

希望有帮助!

于 2013-06-23T20:03:30.713 回答