Question

**请有人可以帮我，我想在Angularjs中打印这样的列表** enter image description here

Answer 1

使用订单

    $scope.friends = [
    {name: 'John',   phone: '555-1212',  age: 10},
    {name: 'Mary',   phone: '555-9876',  age: 19},
    {name: 'Mike',   phone: '555-4321',  age: 21},
    {name: 'Adam',   phone: '555-5678',  age: 35},
    {name: 'Julie',  phone: '555-8765',  age: 29}
  ];             
     <tr ng-repeat="friend in friends | orderBy:'name'">

read more here

Answer 2

创建一个指令，传递一个字母数组和要删除的alphabates范围。

<dummy-directive data="arrayData" range="A-G"></dummy-directive>
<dummy-directive data="arrayData" range="H-L></dummy-directive>
<dummy-directive data="arrayData" range="M-P"></dummy-directive>
<dummy-directive data="arrayData" range="Q-Z"></dummy-directive>

现在的问题是如何实现指令？我们将显示已排序的数据。

Answer 3

您必须按所需的字母过滤每个组。这是一个Plunker使用此列表：

$scope.myList = [{
    id: 11,
    name: 'Okra'
}, {
    id: 12,
    name: 'Musa'
}, {
    id: 4,
    name: 'Sky'
}, {
    id: 13,
    name: 'India'
}, {
    id: 14,
    name: 'Rose'
}, {
    id: 15,
    name: 'Titanic'
}, {
    id: 16,
    name: 'Onion'
}, {
    id: 6,
    name: 'Germany'
}, {
    id: 17,
    name: 'Beer'
}, {
    id: 18,
    name: 'Run'
}, {
    id: 2,
    name: 'Garden'
}, {
    id: 19,
    name: 'Mountain'
}]

获取两者之间字母的一个功能：

function genCharArray(charA, charZ) {
var a = [], i = charA.charCodeAt(0), j = charZ.charCodeAt(0);
for (; i <= j; ++i) {
    a.push(String.fromCharCode(i));
}
return a;

};

然后你的过滤器：

app.filter("cfilter", function () {
return function (input, x, y) {
    var groups = [];
    var letters = genCharArray(x, y);
    for (var i = 0; i < input.length; i++) {
        for (var x = 0; x < letters.length; x++) {
            if (input[i].name.substring(0, 1) == letters[x])
                groups.push(input[i]);
        }

    } return groups;
}

}）;

你的HTML：

    <div ng-repeat="w in myList | cfilter: 'A':'H' | orderBy: 'name'">
  <div>{{w.name}}</div>
</div>

角度显示列表按字母顺序排列并显示分隔符

3 个答案: