带单选按钮的角度过滤数组答案

【问题标题】：Angular filtering array with radio buttons带单选按钮的角度过滤数组
【发布时间】：2019-01-02 04:57:10
【问题描述】：

我有一个 JSON 列表，其中包含一些分类的音频文件及其 URL。

export const musicList = [
  {
    'id': 0,
    'catName': 'upload',
    'audios': [
      {
        'id': 0,
        'name': 'crowd-cheering.mp3',
        'path': 'a.com/music.mp3'
      }
    ]
  },
  {
    'id': 1,
    'catName': 'rock',
    'audios': [
      {
        'id': 1,
        'name': 'Consectetur',
        'path': 'a.com/music.mp3'
      },
      {
        'id': 2,
        'name': 'Vivamus',
        'path': 'a.com/music.mp3'
      }
    ]
  },
  {
    'id': 2,
    'catName': 'folk',
    'audios': [
      {
        'id': 1,
        'name': 'Suspendisse',
        'path': 'a.com/music.mp3'
      }
    ]
  }
];

我用*ngFor 列出这些音乐喜欢：

<div *ngFor="let music of musicList">
  <div *ngFor="let audio of music.audios"> 
    {{audio.name}}
  </div>
</div>

我还用单选按钮列出了他们的类别：

<div *ngFor="let category of musicList">
  <input type="radio" name="genre"> {{category.catName}}
</div>

我只想添加一个过滤器选项。我的意思是当用户选择一个单选按钮时，列表应该显示与所选类别相关的音频文件。

Angular CLI: 6.0.8
Typescript : 2.7.2

【问题讨论】：

看起来更像 Angular 而不是 AngularJS。

标签： arrays angular typescript filter pipe

【解决方案1】：

您可以使用 ng-change 并调用传递所需过滤器的函数

【讨论】：

问题是我不知道如何通过 ng-change 过滤器，ng-change 也不再起作用了。
试试这个（更改）='filterCategory(category.catName)'
我应该在哪里添加这个？我试图在输入单选按钮上添加它，但是：“ERROR TypeError: _co.filterCategory is not a function”