Angularjs 如何使用ng if with table根据条件显示td

参考先前关于ng if IN DIV的帖子，此处给出的链接：，但是当我尝试使用ng if IN table和ng REPECT on td的相同方法时，它似乎不起作用。如果我错了，请纠正我。我根据条件尝试了2次显示列，但均无效。下面我给出了代码以供参考。谁能帮我一下吗。如果您需要更多的澄清，请告知

HTML

尝试：：1

//与hoot数据不同的模板
//与故事数据不同的模板
//与项目数据不同的模板

尝试：：2

<table>
    <tr ng-repeat = "data in comments">
        <div ng-if="data.type == 'hootsslllll' ">
            <td> //differnt template with hoot data </td>
        </div>
        <div ng-if="data.type == 'story' ">
            <td> //differnt template with story data </td>
        </div>
        <div ng-if="data.type == 'article' ">
            <td> //differnt template with article data </td>
        </div>
    </tr>
</table>

//与hoot数据不同的模板
//与故事数据不同的模板
//与项目数据不同的模板

大多数浏览器都会忽略表结构中的任何其他DOM元素（如果格式不正确）。这意味着，在上述代码中，

tr

中不能有

div

标记。试试这个

<table>
  <tr ng-repeat = "data in comments">
    <td ng-if="data.type == 'hootsslllll' "> //differnt template with hoot data </td>
    <td ng-if="data.type == 'story' "> //differnt template with story data </td>
    <td ng-if="data.type == 'article' "> //differnt template with article data </td>
  </tr>
</table>

//与hoot数据不同的模板
//与故事数据不同的模板
//与项目数据不同的模板

ng如果

对您的应该有效，请尝试：：1。下面是小提琴的工作示例

---

避免使用inside来遵循更好的浏览器语义。此外，如果要确保等式表达式的RHS上的值的类型，则在检查等式时，'=='可能是更好的选择

这分别适用于

和

<div ng-controller="tableCtrl">
        <div ng-repeat="data in comments">
            <div ng-if="data.type === 'hootsslllll' ">//differnt template with hoot data</div>
            <div ng-if="data.type === 'story' ">//differnt template with story data</div>
            <div ng-if="data.type === 'article' ">//differnt template with article data</div>
        </div>
</div>

//与hoot数据不同的模板
//与故事数据不同的模板
//与项目数据不同的模板

---

它似乎不太好用。

你能详细说明一下吗？表有时不喜欢trs中的div。尝试删除div，并将ng if表达式直接放入td标记。@ZackArgyle在我的第一次尝试中，我做了相同的操作，但不起作用@：Tim Castelijns需要根据条件显示列

ngIf

根据条件添加和删除dom节点，您可能希望尝试使用

ngShow

或

ngHide

来代替，这只需将相关元素设置为

display:none

。

<div ng-controller="tableCtrl">
        <div ng-repeat="data in comments">
            <div ng-if="data.type === 'hootsslllll' ">//differnt template with hoot data</div>
            <div ng-if="data.type === 'story' ">//differnt template with story data</div>
            <div ng-if="data.type === 'article' ">//differnt template with article data</div>
        </div>
</div>