错误：使用 $http.get() 时的 $rootScope:infdig 无限 $digest 循环

Question

我的 html 页面上有一个按钮列表，单击该列表时应在新页面中打开一个 url。但是，某些 url 返回 http 500 错误。因此，如果按钮后面的链接返回 https 500 错误，我想禁用这些按钮。这是我的 html 和 angular js 代码。实际上，在 html 代码中，有一个循环用于遍历与特定数据相关的所有资源（由 r 显示）（使用 data-ng-repeat），并检查资源的 maintype，如果它是 LINKDOWNLOAD 或 LINK，如果 LINK (r.url) 没有释放错误，应该会出现一个按钮。

为了检查 url 是否释放错误，我使用了 isValid(r.url) 函数。但是，我得到了无数个这个错误：Error: $rootScope:infdig 无限 $digest 循环。

我对使用 isValid(link) 函数的方式做了很多更改。但他们没有成功。请问有什么帮助吗？当我有一个 ng-repeat 循环时，我应该如何执行此任务？

部分html页面：

<div class="gn-related-resources"
     data-ng-if="relationFound">
  <h2>{{::title}}</h2>

  <div class=""
       data-ng-repeat="(type, items) in relations track by $index"
       data-ng-if="type && type !== 'thumbnails'">
    <div class="row list-group-item gn-related-item"
         data-ng-repeat="r in items track by $index"
         data-ng-init="mainType = config.getType(r, type);">
       <div class="col-xs-4" data-ng-if="mainType === 'LINKDOWNLOAD' || mainType === 'LINK'" >
        {{isValid(r.url)}}
        <button type="button"
                class="btn btn-default btn-sm btn-block"
                data-ng-show="isValid(r.url)"
                data-ng-click="config.doAction(mainType, r, md)">

        <span class="visible-lg-*">
          {{::(config.getLabel(mainType, type)) | translate}}
        </span>
        </button>
      </div>
    </div>
  </div>
</div>

angularjs指令的一部分：

  module
  .directive(
      'gnRelated',
      ['gnRelatedService',
    'gnGlobalSettings',
    'gnRelatedResources',
    function( gnRelatedService, gnGlobalSettings, gnRelatedResources) {
      return {
        restrict: 'A',
        templateUrl: function(elem, attrs) {
          return attrs.template ||
                  '../../catalog/components/metadataactions/partials/related.html';
        },
        scope: {
          md: '=gnRelated',
          template: '@',
          types: '@',
          title: '@',
          list: '@',
          user: '=',
          hasResults: '=?'
        },

        link: function(scope, element, attrs, controller) {

          var promise;
          scope.updateRelations = function() {
            scope.relations = [];
            if (scope.uuid) {
              scope.relationFound = false;
              (promise = gnRelatedService.get(
                 scope.uuid, scope.types)
              ).then(function(data) {
                   scope.relations = data;
                   angular.forEach(data, function(value) {
                     if (value) {
                       scope.relationFound = true;
                       scope.hasResults = true;
                     }
                   });
                 });
            }
          };

Answer 1

我强烈建议你不要这样做：{{isValid(r.url)}}

scope.isValid = function(link)
              {
                $http.get(link).then(
                function(success) {
                   return true;
                }, function(error) {
                   return false;
                });
              };

您调用异步调用的每个摘要循环

---

你有relations 列表，创建 Promise all，a.e. $q.all([]) 和分别渲染结果。

而不是isValid(r.url) 我会写这样的东西：

{{r.requestSucceeded}}

在您运行所有请求后将创建requestSucceeded