Question

我在AgularJS中很新，当我尝试练习时：

JS档案：

function CustomersController() {
    this.sortBy = 'name';
    this.reverse = false;

    this.customers= [{joined: '2000-12-02', name:'John', city:'Chandler', orderTotal: 9.9956}, {joined: '1965-01-25',name:'Zed', city:'Las Vegas', orderTotal: 19.99},{joined: '1944-06-15',name:'Tina', city:'New York', orderTotal:44.99}, {joined: '1995-03-28',name:'Dave', city:'Seattle', orderTotal:101.50}];
    this.doSort = function(propName) {
       this.sortBy = propName;
       this.reverse = !this.reverse;
    };
}

HTML文件：

<!doctype html>
<html ng-app="customersApp">
<head>
    <title>Iterating Over Data</title>
    <link href="styles.css" rel="stylesheet" type="text/css" />
</head>
<body ng-controller="CustomersController">
    <h2>Customers</h2>
    Filter: <input type="text" ng-model="customerFilter.name" />
    <br /><br />
    <table>
        <tr>
            <th ng-click="doSort('name')">Name</th>
            <th ng-click="doSort('city')">City</th>
            <th ng-click="doSort('orderTotal')">Order Total</th>
            <th ng-click="doSort('joined')">Joined</th>
        </tr>
        <tr ng-repeat="cust in customers | filter:customerFilter | orderBy:sortBy:reverse">
            <td>{{ cust.name }}</td>
            <td>{{ cust.city }}</td>
            <td>{{ cust.orderTotal | currency }}</td>
            <td>{{ cust.joined | date }}</td>
        </tr>
    </table>
    <br />
    <span>Total customers: {{ customers.length }}</span>

    <script src="angular.js"></script>
    <script src="app/app.js"></script>
    <script src="app/controllers/customersController.js"></script>
</body>
</html>

在网页上，我可以点击表格的头部并按名称排序。所以我想知道sortBy的含义是什么？它是$ scope中的内置变量吗？我试图改变它的名字（比如“sortby”）并且它没有排序（只是反向）。如果是，我在哪里可以找到$ scope的内置函数？非常感谢！

Answer 1

首先，sortBy只是变量的名称，并没有内置到$ scope中。你可以使用任何东西。请注意，sortBy在2个地方被引用：

在HTML中：

<tr ng-repeat="cust in customers | filter:customerFilter | orderBy:sortBy:reverse">

在你的控制器中有两个地方：

// This initializes the sort order
this.sortBy = 'name';
// This sets the new sort order when a user clicks on the table heding
this.sortBy = propName;

您可以为sortBy使用其他名称，只需在所有这些地方替换它。

但是，orderBy特定于ng-repeat，因此您无法更改该名称。有关详细信息，请查看此页面上的最后一个示例： https://docs.angularjs.org/api/ng/directive/ngRepeat

在ng-click中sortBy的含义是什么？

1 个答案: