javascript - 无法理解 AngularJS 中的某些代码

Question

我正在通过阅读一本书来学习 AngularJS，但我遇到了书中几乎没有解释的一些代码行。

因此这个 selectCategory() 函数包含在 ng-click 指令中

<a ng-click="selectCategory()">Home</a>

<a ng-repeat="item in data.products | orderBy:'category' | unique:'category'"
   ng-click="selectCategory(item)">

   {{item}}

</a>

这里还有一个过滤器，用于在触发 ng-click 指令时根据类别过滤列表产品

ng-repeat="item in data.products | filter:categoryFilterFn">

这两个定义如下:

angular.module("sportsStore")
.controller("productListCtrl", function ($scope, $filter) {

    var selectedCategory = null;

    $scope.selectCategory = function (newCategory) {
        selectedCategory = newCategory;
    }

    $scope.categoryFilterFn = function (product) {
        return selectedCategory == null ||
        product.category == selectedCategory;
    }
});

我已经花了很多时间试图理解这些代码，但我仍然很困惑，特别是关于如何定义这两个函数。为什么 $filter 也包含在参数中？另外你能解释一下这些定义吗，我真的迷路了。请原谅我是个新手，非常感谢!!

Answer 1

这是一个非常糟糕的例子!!

应该是:

<a ng-click="selectCategory()">Home</a>

<a ng-repeat="item in data.products | orderBy:'category' | unique:'category'"
   ng-click="selectCategory(item.category)">

   {{item.category}}

</a>

因此，您可以在此处从可用类别(产品的唯一类别)中选择一个类别，然后列出具有此类别的产品(ng-repeat="item in data.products | filter:categoryFilterFn>)

categoryFilterFn 是一个过滤器函数，因此列出类别 == selectedCategory 的产品，如果没有 selectedCategory 则列出所有产品:)

希望这有帮助