Question

我正在使用AngularJs，html来显示表并在表中显示记录。
演示：http://plnkr.co/edit/xHRLAynOpUiLWbOKhqUm?p=preview&preview

我试图单击第二列中存在的数字超链接。目前，我正在使用逗号（,）分隔符分割数字，并使用<a href>链接传递我单击的关联数字（可以看到在第一行链接上的工作）。

有时候数据是动态的，我可能会以分号（;）或冒号（:）作为分隔符，然后代码会中断，单击链接时会传递多个关联的数字。

<a ng-repeat="associateNum in player.associatedNumber .split(',')" href="https://urladdr/associateid={{associateNum}}" target="_blank">
       {{associateNum}}<span ng-if="$index+1 != player.associatedNumber.split(',').length">;</span></a>

即使同一行中的关联数字具有<a href>或,或;作为分隔符，如何支持上述:链接？

js代码：

app.controller('MainCtrl', function($scope) {
  $scope.players = [{
    "name": "Robert C",
    "associatedNumber": "21,10,133",
    "standing": true,
    "result":"Delivered,shipped,shipped"
}, {
    "name": "Joey C",
    "associatedNumber": "55,2:22;33",
    "standing": false,
    "result":"To be delivered,Delivered"
}, {
    "name": "Bobby A",
    "associatedNumber": "15;22:11",
    "standing": true,
    "result":"TO be delivered"
}, {
    "name": "John A",
    "associatedNumber": "1,33,34",
    "standing": true,
    "result":"To be delivered,shipped"
}];
});

Answer 1

我要添加一个过滤器：

app.filter('splitNumber', function() {
  return function(input) {
        return input.replace(/[;:]/g,',').split(',');
  };
});

并像这样使用它：

ng-repeat="associateNum in player.associatedNumber | splitNumber"

我为你的here分叉了

Answer 2

Split也采用正则表达式：

app.filter('splitNumber', function() {
  return function(input) {
    //return input.replace(/[;:]/g,',').split(',');
    return input.split(/[,:;]/);
  };
});

DEMO on PLNKR

有关更多信息，请参见MDN JavaScript Reference - String.prototype.split()

在拆分中使用多个定界符

2 个答案: