预处理ng个重复变量

Question

我使用ng repeat在div中打印输出。bCrumbs集合中的元素以斜线和空格开头，我想将它们从第一次循环迭代中删除。

我的代码：

<div ng-repeat="bCrumb in bCrumbs" id="{{bCrumb.name}}">{{ bCrumb.name }}</div>

{{ bCrumb.name }}:的输出

/ Test1
/ Test2

预期输出：

Test1
/Test2

Answer 1

您可以使用ng-repeat-start和ng-repeat-end

<div ng-repeat-start="bCrumb in bCrumbs" ng-if="$first>
    {{ beautify(bCrumb.name) }}
  </div>
  <div ng-repeat-end ng-if="!$first">
    {{ bCrumb.name }}
  </div>

此外，在控制器中定义一个名为beautify的函数：

$scope.beautify = function (name) {
  return name.replace('/ ', '');
};

你可以在这里阅读详细的文档

更新

处理字符串美化的更好方法是创建一个过滤器来处理它

app.filter('beautify', function () {
    return function (data) {
        return data.replace("/ ", "");
    };
});

然后在您的视图模板中：

  <div ng-repeat-start="bCrumb in bCrumbs" ng-if="$first>
    {{ bCrumb.name | beautify }}
  </div>
  <div ng-repeat-end ng-if="!$first">
    {{ bCrumb.name }}
  </div>

Answer 2

我认为您应该更改控制器（或产生bCrumbs的任何控制器），以便在到达视图之前去掉斜线。这样一来，它将更易于测试，（希望）更清晰。你可以这样做：

function strip(s) {
    if(s.indexOf('/ ') === 0) {
        return s.substring(2);
    } else {
        return s;
    }
}
$scope.bCrumbs = originalBCrumbs.map(function(bc, idx) {
    return idx === 0 ? strip(bc) : bc;
});