javascript - 检查链接是否有 https ://in angularjs

Question

我的 Angular 应用程序中有大量 JSON 格式的数据，

[
  {"link": "https://stackoverflow.com"},
  {"link": "https://stackoverflow.com"},
  {"link": "id-aW783D"}, //This is a wrong data
  {"link": "https://stackoverflow.com"}
]

但是正如您在 JSON 中看到的，第三个对象具有无效值(不是链接)，

现在我需要将这些链接与 a 绑定(bind)，但是 {"link": "id-aW783D"} 在 a 中无效code> 因为它不是有效的 URL。

我添加此代码是为了避免无效链接，但由于此代码和大量数据，应用程序需要大量时间来加载。

for(i; i < $scope.data.length; i++){
 item = $scope.data[i];
 if (item.link.indexOf("https://")){
   item.ID = item.link;
 }
 else item.ID = '';
}

现在我的问题是，有没有其他方法可以做到这一点，例如使用 ng-if ？

angular.module('myApp', []).controller('myCtrl', function($scope) {

  $scope.data = [
    {"link": "https://stackoverflow.com"},
    {"link": "https://stackoverflow.com"},
    {"link": "id-aW783D"},
    {"link": "https://stackoverflow.com"}
  ];
  var i = 0;
  for (i; i < $scope.data.length; i++) {
    item = $scope.data[i];
    if (item.link.indexOf("https://")) {
      item.ID = item.link;
    } else item.ID = '';
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  <ul ng-repeat="j in data track by $index">
    <li ng-if="j.ID">{{j.link}}</li>
    <li ng-if="!j.ID"><a href="{{j.link}}">{{j.link}}</a></li>
  </ul>
</div>

Answer 1

Js 速度相当快。 NG-if 慢得多。以及渲染 html 标签

即对 100 万个对象运行“for”:

var start = new Date();
for(i = 0; i < 1000000; i++){
 item = {link: '123321https://'};
 if (item.link.indexOf("https://")){
   item.ID = item.link;
 }
 else item.ID = '';
}
console.log(new Date() - start)

在我的 chrome 中需要 139 毫秒。

我怀疑我的计算机能否在页面上有 1kk 链接的页面中幸存。

实际上你需要的是虚拟/无限滚动。