AngularJS中如何基于条件过滤ng-repeat展示的数据

嘿，我来帮你搞定这个需求！要在展示草稿列表时隐藏draftName为"empty"的条目，你可以用以下两种常用方法：

方法一：直接在ng-repeat中使用内置过滤器 #

AngularJS的filter指令支持用!来排除匹配的值，你只需要在ng-repeat表达式里添加过滤条件就行：

<tr ng-repeat='draft in drafts | filter:{draftName: "!empty"}'>
    <td>{{draft.draftName}}</td>
    <td>{{draft.senderName}}</td>
    <td>{{draft.message}}</td>
</tr>

这个写法的好处是快速直接，不需要修改控制器代码，适合简单的过滤场景。

方法二：在控制器中预处理过滤数据 #

如果你的数据量比较大，或者需要在多个地方使用过滤后的草稿列表，更推荐在控制器里先处理好数据，再绑定到视图：

// 在你的控制器中添加这段代码
$scope.filteredDrafts = $scope.drafts.filter(function(draft) {
    return draft.draftName !== "empty";
});

然后在视图里遍历处理后的数组：

<tr ng-repeat='draft in filteredDrafts'>
    <td>{{draft.draftName}}</td>
    <td>{{draft.senderName}}</td>
    <td>{{draft.message}}</td>
</tr>

这种方式把过滤逻辑集中在控制器里，性能更优，也方便后续维护和复用过滤规则。

两种方法都能实现你的需求，你可以根据自己的场景选择合适的方式~

内容的提问来源于stack exchange，提问作者Sameer