使用管道按键值过滤JSON

我有以下格式的对象数组：

{
            img: './app/images/codeeval.png',
            name: 'codeEval',
            repo: 'https://github.com/Shooshte/CodeEval',
            description: 'CodeEval challenges solutions written in javascript and posted to gitHub.',
            github: true,
            demo: false,
            finished: true
        }

现在我要做的是编写一个自定义管道，它接受一个字符串，然后检查对象是否将该字符串设置为true。假设我传入

'demo'

，它将返回所有具有

demo:true

的对象

我的html：

<div *ngFor="#p of pages | pagesFilter: 'demo'" class="portfolioPageContainer">
    <img [attr.src]="p.img" class="portfolioThumbnail">
    <h2>{{ p.name }}</h2>
    <a [attr.href]="p.repo">
        <div>
            <p>{{ p.description }}</p>
        </div>
        <p class="portfolioRepoLink">See the Code!</p>
    </a>
</div>

我在控制台中遇到以下错误：

angular2.dev.js:23730异常：错误：未捕获（承诺中）： 组件视图上意外的管道值“未定义” “PortfolioComponent”

有人能指出我做错了什么吗

---

感谢您的帮助

课程不支持提升。您需要在上课前定义管道：

@Pipe({ name: 'pagesFilter' })
class pagesFilter implements PipeTransform {
  transform(pages: Array, [key]): string {
    return pages.hasOwnProperty(key);
  }
}

@Component({
  selector: 'portfolio',
  templateUrl: '/app/views/portfolio.html',
  styleUrls: ['../app/styles/PortfolioMobile.css', '../app/styles/PortfolioOther.css'],
  pipes: [pagesFilter],
  encapsulation: ViewEncapsulation.None
})
export class PortfolioComponent {
  (...)
}

更新

管道应返回数组而不是布尔值：

@Pipe({ name: 'pagesFilter' })
class pagesFilter implements PipeTransform {
  transform(pages: Array, [key]): string {
    return pages.filter(page => {
      return page.hasOwnProperty(key);
    });

  }
}

---

这解决了最初的问题，但现在我得到：angular2.dev.js:23730异常：在[pages | pagesFilter:'demo'中找不到不同的支持对象'false'PortfolioComponent@0:5]

@Pipe({ name: 'pagesFilter' })
class pagesFilter implements PipeTransform {
  transform(pages: Array, [key]): string {
    return pages.filter(page => {
      return page.hasOwnProperty(key);
    });

  }
}