AngularJS ng重复，通过逗号 'and' 在最后一个元素之前

$ last是真理价值。因此，它包含真相或谎言，它不包含最后一个元素的索引..

我认为下面给出的表达应该解决你的问题

<p><span ng-repeat="user in Users">

 {{user.Username}} {{$last ? '' : /$index==Users.length-2/ ? ' and ' : ', '}}

 </span></p>

还要确保您有表达式 $last 在元素内 ng-repeat, 而不是在它之外

请在工人下方查看 fiddle

http://jsfiddle.net/hrishi1183/Sek8F/2/
/

它可以是一个解决方案之一

<span data-ng-repeat="user in Users">{{user.Username}}<font ng-show="!$last">,</font></span>

<span ng-repeat="user in Users">{{$first ? '' : $last ? ' and ' : ', '}}{{user.Username}}</span>

而不是添加一些东西，添加它。 您可以使用

$first

, 降低第一。 然后你可以使用

$last

添加 "and" 而不是逗号。

之前使用逗号

和

为了提高清晰度！

比尔盖茨捐赠 6 百万美元 Username1, Username2 和 Username3.

vs.

比尔盖茨捐赠 6 百万 Username1, Username2 和 Username3.

如果没有一致的分号，则不清楚地指示每个用户应提供相同的份额。

<span ng-repeat="user in Users">

 {{user.Username}}{{$last ? '' : /$index==Username.length-2/ ? ', and ' : ', '}}

</span>

输出：

Username1, Username2, Username3, and Username4

今天我遇到了这个问题，但还有一个额外的问题，这就是列表元素可以在提议中进行格式化 /例如，

大胆的元素

或链接/. 所以刚从过滤器输出行不起作用。 首先我试图使用 ng-bind-html 和产出 HTML 从过滤器，但它不够灵活。

因此，我创建了一个可用于任何可用的指令 ng-repeat 在列表元素之间添加分隔符。 诀窍是我只访问了 $first, $last, 和 $index /而不是源阵列或其长度！/.

我的决定：

var app = angular.module/'app', []/;

app.directive/'listSeparator', function// {

 return {

 replace: true,

 template: '<span>{{ separator }}</span>',

 link: function/scope, elem, attrs/ {

 scope.$watchGroup/["$index", "$first", "$last"], function// {

 if /scope.$first/

 scope.separator = "";

 else if /scope.$last && scope.$index == 1/

 scope.separator = " and ";

 else if /scope.$last/

 scope.separator = ", and ";

 else

 scope.separator = ",";

 }/

 }

 }

}/

<script src="[url=http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js"></script>]http://ajax.googleapis.com/aja ... gt%3B[/url]

<div ng-app="app">

 Click a button to see the formatted list.

 <button ng-click="myArray = ['one']">One item</button>

<button ng-click="myArray = ['one','two']">Two items</button>

<button ng-click="myArray = ['one','two','three']">Three items</button><br/>

<span ng-repeat="item in myArray"><list-separator></list-separator>

<strong>{{item}}</strong></span>

</div>

享受！

如果您只需要文本输出，请使用自定义过滤器

ng-repeat

:

<span>{{Users | humanizedUserList}}</span>

过滤器代码是关于这样的 /使用
https://lodash.com/
/:

app.filter/'humanizedUserList', function// {

 return function/users/ {

 var last_users = _.last/users, 2/;

 return _.reduce/users, function/out, user, idx, users/ {

 out += user.UserName;



 if/user === last_users[1]/ { // last entry

 return out;

 }

 else if/user === last_users[0]/ { // second to last entry

 return out + ', and ';

 }

 else {

 return out + ', ';

 }

 }/;

 };

}

你会摆脱黑客使用

$last

在......之外

ng-repeat

和三元经营者 - 而且您将添加重复使用应用程序的其他部分的可能性。