当值为空时如何隐藏标签文本?

Within a table cell, I am listing several items that are populated using ng-repeat, using the structure below. However, for some entries, properties such as "user.favcolor" are blank. What's the easiest way to hide text such as "Favorite color:" in that case so that I don't end up with a row that has "Favorite color:" and no value beside it?

在表单元格中，我列出了几个使用ng-repeat填充的项，使用下面的结构。但是，对于某些条目，属性如“user”。favcolor”是空白。什么是最简单的隐藏文本的方法，比如“最喜欢的颜色”，这样我就不会得到一个“最喜欢的颜色”的行了，而它旁边没有任何值?

        <table>
            <thead>
                <tr>
                    <th>Price</th>
                    <th>Plan Contents</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="tip in tips">
                    <td>{{tip.priceMonthly}}</td>
                    <td><span>Name: {{user.name}}</span>
                        <span>ID: {{user.id}}</span>
                        <span>Favorite color: {{user.favcolor}}</span>
                    </td>
                </tr>
            </tbody>
        </table>

1 个解决方案

#1

You can use the ng-show directive for this:

你可以使用ng-show指令:

<span ng-show="user.favcolor">Favorite color: {{user.favcolor}}</span>

The ng-show works such that the element is only shown if the expression evaluates to true. An empty string here will evaluate to false hiding the entire element.

ng-show的工作原理是，只有在表达式计算为true时才显示元素。这里的空字符串将评估为false隐藏整个元素。

Alternatively, you can also specify a default value:

您也可以指定一个默认值:

<span>Favorite color: {{user.favcolor || "Not specified" }}</span>

In this case, if user.favcolor evaluates to a false, it will print Not specified instead.

在这种情况下，如果用户。favcolor计算的值为false，它将输出未指定的值。

#1