optimization ng-repeat in angularjs

Question

我有一个 json 文件。

{"records":
[
{"masp":"CPUIT5","loai":"cpu","hangsx":"INTEL","tensp":"CPU INTEL CORE I5","gia":"8789000"}
,{"masp":"CPUIT7","loai":"cpu","hangsx":"INTEL","tensp":"CPU INTEL CORE I7","gia":"12300495"},
{"masp":"CPUXE5","loai":"cpu","hangsx":"INTEL","tensp":"CPU XEON E5 2600 V5","gia":"99567600"},
{"masp":"VGAASTI","loai":"vga","hangsx":"GIGABYTE","tensp":"VGA GTX Gigabyte 1080Ti","gia":"20999000"},
{"masp":"VGARX48","loai":"vga","hangsx":"AMD","tensp":"VGA RADEON RX480","gia":"12900000"},
{"masp":"VGARX46","loai":"vga","hangsx":"AMD","tensp":"VGA RADEON RX460","gia":"5600000"}
]}

我使用 ng-repeat 在 html 中显示它，但我只想显示 loai=cpu 。我能做什么.这是我的代码

ng-repeat="data in vm.mydata " ng-show="data.loai=='cpu'"

但是非常慢.有没有办法优化它？

Answer 1

您可以在 JavaScript 而不是 HTML 中过滤数据

$scope.filtered = data.records.filter(function (element) {
    return element.loai === 'cpu'
});

.HTML

ng-repeat="data in filtered" //won't have extra DOM checking vs using ng-show

Answer 2

欣赏上面的答案。但我们也可以简单地做到这一点。

<div ng-repeat= "record in records | filter: { loai:'cpu' } ">
 <span>{{ record.loai}}</span>