1

在我的 Angular 应用程序中，我发出一个网络请求，以根据用户选择的过滤器返回一些过滤后的数据。这按预期工作。接收过滤器值并发出请求的函数如下所示：

public onFilterReceived(values)
{
    let languageFilter = [];
    let cityFilter = [];
    let zipFilter = [];
    let firstNameFilter = [];
    let lastNameFilter = [];

    this.route.params.subscribe(
        (params: any) => {
            this.page = params['page'];
            this.pn_zip_e = params['pn_zip.e'];
            this.pn_firstName_e = params['pn_firstName.e'];
            this.pn_lastName_e = params['pn_lastName.e'];
            this.pn_city_e = params['pn_city.e'];
            this.pn_language_e = params['pn_language.e'];
        }
    );

    this.pn_language_e === "1" ? languageFilter = values['language'] : languageFilter = [];
    this.pn_city_e === "1" ? cityFilter = values['city'] : cityFilter = [];
    this.pn_zip_e === "1" ? zipFilter = values['zip'] : zipFilter = [];
    this.pn_firstName_e === "1" ? firstNameFilter = values['firstName'] : firstNameFilter = [];
    this.pn_lastName_e === "1" ? lastNameFilter = values['lastName'] : lastNameFilter = [];

    this.sendDebouncedRequest(this.page, this.pagesize, languageFilter, cityFilter, zipFilter, firstNameFilter, lastNameFilter);
};

现在，在应用程序上，我们还有一些 UI 可以让用户更改分支，这将随后过滤整个应用程序中的所有数据。因为分支更改 UI 位于不同的组件中，所以我使用事件发射器通过共享服务向其他组件宣布此更改。

我的目标是接收此事件的通知，然后再次触发网络请求。后端将从那里处理数据过滤。

我遇到的问题是，在通过事件发射器成功接收事件通知并传递对要触发的函数的引用后，在接收组件中看起来像这样：

this.branchChangeSub = this.branchInfoService.selectedBranchChange.subscribe(this.onBranchChange);

...当我通过此代码再次启动网络请求功能时：

public onBranchChange(values) {
    console.log('announceBranchChange firing...');
    if (values) {
        console.log('have values...');
        this.onFilterReceived(values); // Resend the network request
    }
}

...我收到此错误：

TypeError：无法读取未定义的属性“onFilterReceived”

这就是我感到困惑的地方。为什么onFilterReceived()这里未定义？为什么我在加载组件时可以成功触发此功能，但在收到分支更改通知后却不能。我在这里从根本上误解了一些东西。

4

1 回答 1

2

尝试更新对 inside 的调用以onBranchChange()使用subscribe箭头函数来保留 的上下文this：

this.branchChangeSub = this.branchInfoService.selectedBranchChange.subscribe(values => this.onBranchChange(values));

希望这会有所帮助！

于 2019-02-18T18:37:10.070 回答