Question

我希望我的表根据值是否为null有条件地呈现其行。行具有不同的自定义条目和标签，这就是为什么我不能只使用ng-repeat。这是代码：

<table>
    <thead>
    </thead>
    <tbody>
        <tr ng-show = "{{data.entry_1}} !== null">
            <td>Custom Label 1</td>
            <td>{{data.entry_1}}</td>
        </tr>
        <tr ng-show = "{{data.entry_2}} !== null">
            <td>Custom Label 2</td>
            <td>{{data.entry_2}}</td>
        </tr>
        .
        .
        .
        <tr ng-show = "{{data.entry_n}} !== null">
            <td>Custom Label n</td>
            <td>{{data.entry_n}}</td>
        </tr>
    </tbody>
</table>

然而，似乎这种方式不对。它是javascript（编译器）在ng-show中的{{}}或'！== null'或两者都抱怨。如何评估 ng - 指令中的角度表达式（{{}}）？

我知道我也可以在js文件中对此进行评估，但由于我不想再添加范围变量（为了使我的代码更清晰），我选择在ng-show中评估它是否为null指示。有人可以告诉我该怎么做吗？

感谢。

Answer 1

你很亲密。花括号只需要回显/打印/渲染变量的值。在表达式中，你永远不应该使用花括号。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<table ng-app ng-init="data = {entry_1: 'notnull', entry_2: null, entry_n: 'againNotNull'}">
    <thead>
    </thead>
    <tbody>
        <tr ng-show="data.entry_1">
            <td>Custom Label 1</td>
            <td>{{data.entry_1}}</td>
        </tr>
        <tr ng-show="data.entry_2">
            <td>Custom Label 2</td>
            <td>{{data.entry_2}}</td>
        </tr>
        .
        .
        .
        <tr ng-show="data.entry_n">
            <td>Custom Label n</td>
            <td>{{data.entry_n}}</td>
        </tr>
        <tr ng-show="data.device">
            <td>Custom Device</td>
            <td>{{data.device}}</td>
        </tr>
    </tbody>
</table>

Answer 2

在指令范围内使用$ compile服务。

参见https://docs.angularjs.org/api/ng/service/ $ compile

编辑：我同意马丁的回答。

评估角度指令内的表达式

2 个答案: