Question

所以我目前正在尝试过滤ng-repeat以仅显示与其父相册具有相同相册名称的索引。我无法过滤任何东西，它只是显示每一首歌。我的代码......

专辑/歌曲阵列。

$scope.albums = [
    {
        id: 'one',
        title: ' - Gregs Shoes',
        img: 'imgs/cover1.png',
        songs : [
            {
                id: 'one',
                title: 'Rain',
                url: 'http://www.schillmania.com/projects/soundmanager2/demo/_mp3/rain.mp3',
                album: ' - Gregs Shoes'
            },
            {
                id: 'two',
                title: 'Angry cow sound?',
                url: 'http://www.freshly-ground.com/data/audio/binaural/Mak.mp3',
                album: ' - Gregs Shoes'
            },
            {
                id: 'three',
                title: 'Things that open, close and roll',
                url: 'http://www.freshly-ground.com/data/audio/binaural/Things%20that%20open,%20close%20and%20roll.mp3',
                album: ' - Gregs Shoes'
            }
        ]
    },

    {
        id: 'two',
        title: ' - Hankey Pankey',
        img: 'imgs/cover2.jpg',
        songs : [
            {
                id: 'one',
                title: 'Walking',
                url: 'http://www.schillmania.com/projects/soundmanager2/demo/_mp3/walking.mp3',
                album: ' - Hankey Pankey'
            },
            {
                id: 'two',
                title: 'Barrlping with Carl (featureblend.com)',
                url: 'http://www.freshly-ground.com/misc/music/carl-3-barlp.mp3',
                album: ' - Hankey Pankey'
            }
        ]
    },

     {
        id: 'three',
        title: ' - Gross Misc.',
        img: 'imgs/cover3.jpg',
        songs : [
            {
                id: 'one',
                title: 'inDreworkdd.jpeg',
                url: 'todo',
                album: ' - Gross Misc.'
            },
            {
                id: 'two',
                title: 'Protsin',
                url: 'todo',
                album: ' - Gross Misc.'
            },
            {
                id: 'three',
                title: 'Little Baggies',
                url: 'todo',
                album: ' - Gross Misc.'
            },
            {
                id: 'four',
                title: 'Coriolis',
                url: 'todo',
                album: ' - Gross Misc.'
            },
            {
                id: 'five',
                title: 'Really Poppin',
                url: 'todo',
                album: ' - Gross Misc.'
            },
            {
                id: 'six',
                title: 'Cowhisper',
                url: 'todo',
                album: ' - Gross Misc.'
            }
        ]
    },
];

打开相册。（设置currentAlbum变量）

<li ng-repeat="album in albums">
            <div style="background: url({{album.img}}); background-size: contain;" class="aAlbum">
                <button play-all="album" my-playlist="playlist" style="text-shadow: 0px 0px 12px #000;">&#9658;</button>
                <a href="#album" style="height: 100%; width: 100%;" ng-click="selectedAlbum=album.title">go</a>
            </div>
        </li>

并最终尝试使用selectedAlbum按专辑名称过滤歌曲。

<div my-directive>
    <ul>
        <li ng-repeat="album in albums">
            <ul>
                <li ng-repeat="song in album.songs | filter: selectedAlbum">
                    <p>{{song.title}}</p>
                </li>
            </ul>
        </li>
    </ul>

    <a href="#">Back</a>
</div>

应该允许我使用selectedAlbum的指令。

animateApp.directive('myDirective', function() {
    return {
        selectedAlbum: 0
    }
});

Answer 1

要显示特定相册中已过滤的歌曲标题，

 <li ng-repeat="song in album.songs | filter: {album: ' - Specific Album Name'}">

Answer 2

您可以让ng-if控制呈现哪些相册，而不是过滤：

<li ng-repeat="album in albums" ng-if="album.title === selectedAlbum">

过滤ng-repeat到表的值

2 个答案: