订阅Angular2 eventEmitter没有收到价值

Question

我有多个功能都不同的签名：

getBooks(author, id);
getMusic(year, genre);
getProduct(name, id);

全部返回相同类型的数据： pagedData 。 此pagedData包含数据本身和nextUrl来获取下一页：

{
   data: [
     ...
   ]
   nextUrl: "http://api.com?page2"
}

在Angular2中，我创建了要重用的pagedData组件。 对于书籍，音乐和产品，页面外观相同。 唯一的区别是for循环内的html遍历所有项目。

该组件的代码如下所示：

export class PagedData implements OnInit {

    @Output() loadMore = new EventEmitter();

    nextPage = null;

    pageData: IPagedData;

    constructor() {
        this.loadMore.subscribe(res => {
            console.log('res', res);
        });
    }

    ngOnInit() {
        this.loadMore.emit();
    }

}

以及特定于Book的代码，例如：

@Component({
    template: `
        <paged-data (loadMore)="update($event)"></paged-data>
    `
})

export class BooksPage {

    constructor(
        public bookService: BookService) {
    }

    update(event) {
        return this.BookService.getBooks('jack', 29349);
    }

}

我的问题是，即使我已经订阅loadMore并发出事件， console.log('res', res); 持续显示res, undefined 。

有人看到出什么问题了吗？ 在过去，我会做一个回调而不是发射器，而只是让每个页面都给组件提供另一个回调。 然后，组件可以调用该函数以获取数据。 也许我在想用事件发射器创建这种行为的错误方法。

Answer 1

this.loadMore.emit();

没有发出值。 如果您使用

this.loadMore.emit('foo');

你会得到不同的输出

Answer 2

输出变量用于发出，而不是可观察到的

@Output() loadMore = new EventEmitter<string>();

this.loadMore.emit(..); 

它也应该具有<T>类型