5

以下代码段是否存在任何表面问题：

  <ul id="entry-name" class="breadcrumb">
      <li ng-repeat="dir in pathElements()" class="active">
          <span ng-show="!$last">
              &nbsp;<a href="#!?path={{dir.url}}">{{ dir.name }}</a>&nbsp;<span ng-show="!$first" class="dividier">/</span> 
          </span>
      </li>
      <li class="active">{{ pathElements()[pathElements().length - 1].name }}</li>
  </ul>

用这个js：

  $scope.pathElements = function() {
      var retval = [];
      var arr = $scope.currentPath().split('/');
      if (arr[0] == '') {
          arr[0] = '/';
      }

      var url = "/";
      retval.push({name: arr[0], url: url});
      for (var i = 1; i < arr.length; ++i) {
          if (arr[i] != '') {
              url += arr[i] + '/';
              retval.push({name: arr[i], url: url});
          }
      }
      return retval;
  };

这似乎导致“错误：达到 10 个 $digest() 迭代。中止！” 错误，但我不确定为什么。是因为 pathElements() 每次都返回一个新数组吗？有没有办法解决这个问题？

4

2 回答 2

4

是的，这是因为您每次都返回一个新数组，并且 $digest 循环无限循环（但 Angular 停止了它）。您应该在函数之外声明它。

$scope.pathArray = [];
$scope.pathElements = function() {
  // retval becomes $scope.pathArray
  if (weNeedToRecalcAllPathVariables) {
    $scope.pathArray.length = 0;
    // ...
  }

  // ...
}

我们使用$scope.pathArray.length = 0而不是创建一个新的，以避免它连续触发。

您还应该考虑@Flek 的建议。仅在需要重新计算时调用此函数一次。你绑定的所有东西都应该直接结束$scope.pathArray。

如果你确实需要一个函数在使用它之前测试它的清洁状态，那么至少我建议你创建两个单独的函数，只是为了让每个函数都有自己的属性。

于 2013-03-19T12:29:49.423 回答
3

有关如何在 Angular 中实现面包屑的一些很好的参考，请查看angular-app项目（面包屑服务，如何使用它）。

这是一个演示plunker。

于 2013-03-19T12:58:03.053 回答