Question

我尝试制作see more按钮，以便在点击时获得更多搜索结果。

我将标题放在单独的arrchivos中，并将其用于：

<ion-header>
  <page-header> </page-header>
</ion-header>

对于每个视图。

生成事件的按钮位于search-modal.html，如下所示：

  <div (click)="seeMoreResults($event)">
    <button color="primary" block>see more</button>
  </div>

search-modal.ts控制器如下所示：

Import {Component, EventEmitter, Output} from '@ angular / core';

@Component({
  selector: 'page-search-modal',
  templateUrl: 'search-modal.html',
})
export class SearchModalPage {

@Output()
public updateSearchResults = new EventEmitter();

seeMoreResults(event) {
    this.countSearchResult = Object.keys( this.searchResult ).length; // "this.searchResult" are the search results that arrive when something is typed.
    this.updateSearchResults.emit( this.countSearchResult );
}

header.html有这个：

<ion-toolbar (updateSearchResults)='updateSearchResults($event)'>
// Here is my search bar.
</ion-toolbar>

我的header.ts有：

updateSearchResults(lastTotal){
  this.search((10+lastTotal), lastTotal, true);
  // "search" is the method that makes me search and issues the result.
}

第一次搜索工作正常，这就是我省略代码的原因。但是当我点击＆＃34;看到更多＆＃34;按钮它不会发出任何内容，我试图将console.log("Run");放在updateSearchResults header.ts内，但从不打印。

知道为什么会这样吗？

对不起翻译，我会讲西班牙语。

Answer 1

(updateSearchResults)输出需要绑定在其输出的组件上，即page-search-modal（根据您的代码）。即。

<page-search-modal (updateSearchResults)='updateSearchResults($event)'>
// Here is my search bar.
</page-search-modal

@Output（）EventEmitter不工作

1 个答案: