javascript - 在范围内过滤 AngularJS

Question

我正在尝试对我的代码应用某种过滤器，但是当我单击菜单时它并没有改变任何东西。我最初需要显示我的所有专辑，如果用户点击其中一位艺术家，我想过滤它们。下面是我的控制器：

Function ListCtrl($scope, $http) {

$http({
    method: 'GET',
    url: 'json/json_price_1.json'
}).success(function(data) {
    $scope.artists = data.artists; // response data

    $scope.albums = [];
    $scope.currentArtist = null;
    $scope.setArtist = function(name) {
        $scope.currentArtist = $scope.artists[name];
    };
    if ($scope.currentArtist == null) {
        angular.forEach($scope.artists, function(element, index) {
            angular.forEach(element.albums, function(album, index) {
                $scope.albums.push(album);
            });
        });
    } else {
        angular.forEach($scope.currentArtist.albums, function(album, index) {
            $scope.albums.push(album);
        });
    };

});};

我的html如下：

<div ng-controller="ListCtrl">  
<ul class="topcoat-list" ng-repeat="artist in artists">
    <li class="topcoat-list__item">
        <a href="" ng-click="setArtist(artist.name)">
            {{artist.name}}
        </a>
    </li>   
</ul></div>
<div ng-controller="ListCtrl">
<ul ng-repeat="album in albums">
  <li>{{album.title}}</li>
</ul>

谢谢你们的时间！

Answer 1

不是 angularjs 专家，问题是您在设置艺术家后没有过滤专辑。

Function ListCtrl($scope, $http) {

    $scope.setArtist = function (name) {
        $scope.currentArtist = $scope.artists[name];
        $scope.filter();
    };

    $scope.filter = function () {
        $scope.albums = [];
        if (!$scope.currentArtist) {
            angular.forEach($scope.artists, function (element, index) {
                angular.forEach(element.albums, function (album, index) {
                    $scope.albums.push(album);
                });
            });
        } else {
            angular.forEach($scope.currentArtist.albums, function (album, index) {
                $scope.albums.push(album);
            });
        };

    }


    $http({
        method: 'GET',
        url: 'json/json_price_1.json'
    }).success(function (data) {
        $scope.artists = data.artists; // response data

        $scope.currentArtist = undefined;
        $scope.filter()

    });
};

角度解决方案是使用过滤器- 类似于这个演示