Question

我有一组具有属性'name'的对象。

<script>
function FriendsCtrl($scope) {
$scope.friends = [{
    email: ['abc', 'def'],
    name: "i'm noob"
}, {
    email: ['ghi', 'jkl'],
     name: "me 2"
},
{
    email: ['ghi', 'jkl'],
     name: "and me!"
}];
}
</script>

我想在div中列出所有名称的字符串，用'，'分隔我设法这样做，使用下划线：

<span ng-repeat="email in friends">{{email.name}}{{$last ? '' : ', '}}</span>

雷兹：

i'm noob, me 2, and me!

如何使用角度方式解决这个问题？

谢谢！

小提琴：http://jsfiddle.net/UJEnt/

Answer 1

为了创建类似CSV的行为，您可以使用自定义filter（documentation）

<强> http://jsfiddle.net/c8DKB/3/

csv过滤器

myApp.filter('csv', function() {
    return function(values, property_name) {
        var result = '';
        for (var i = 0; i < values.length; i++) {
            var value = values[i];
            if (property_name) {
                value = value[property_name];
            }
            result += value;
            if (i + 1 != values.length) {
                result += ',';
            }
        }
        return result;
    };
});

<强>使用

friends是数据源，name是属性

<div>{{friends | csv:'name'}}</div>

你也可以在不指定属性名的情况下使用它（如果你正在处理字符串数组）

<div>{{another_string_array | csv}}</div>

<强>结果

<强> http://jsfiddle.net/c8DKB/3/

Answer 2

JS：

angular.module('foo').filter('concat', function(input, field) {
    var result = [];

    for (var i = 0, ii = input.length; i < ii; ++i) {
        result.push(input[i][field]);
    }

    return result.join(', ');
});

HTML：

<span>{{ friends | concat:'name' }}</span>

列出数组对象属性分隔，

2 个答案: