Question

我正在尝试在$broadcast中实现$on和>ionic2，我在Stackoverflow中找到了这个解决方案

using $on and $broadcast with angular js 2 ，从现在开始，我认为它完美无缺。

我已经像这样实施了oneSignal：

var iosSettings = {};
iosSettings["kOSSettingsKeyAutoPrompt"] = true;
iosSettings["kOSSettingsKeyInAppLaunchURL"] = false;
window["plugins"].OneSignal.startInit("123123", "123123")
.inFocusDisplaying(window["plugins"].OneSignal.OSInFocusDisplayOption.None)
.iOSSettings(iosSettings)
.handleNotificationReceived(function (jsonData) {
    alert(JSON.stringify(jsonData));
    if (jsonData["payload"] != null && jsonData["payload"]["additionalData"] != null) {
        alert("first"); //<------ FIRST ALERT
        var data = jsonData["payload"]["additionalData"];
        notificationOpenedCallback(data);
    }
})
.handleNotificationOpened(function (jsonData) {
    if (jsonData["notification"] != null && jsonData["notification"]["payload"] != null) {
        var data = jsonData["notification"]["payload"]["additionalData"];
        notificationOpenedCallback(data);
    }
})
.endInit();

我的notificationOpenedCallback(data)身上有这个

var notificationOpenedCallback = function (jsonData) {
                if (jsonData != null) {
                    if (jsonData["type"] == "example") {
                        alert("second"); //<------ SECOND ALERT
                        this.sharedService.broadcast({
                            name: 'example'
                        });
                    }

由于这里没问题，当我来自其他页面时问题出现了......

this.sharedService.on('example', (event) => {
            alert("pewpew"); // <--- 3RD ALERT
        });

我不知道我做错了我有一个Ionic1应用程序而且我有相同的代码，唯一不同的是我创建了sharedServiceProvider来“模仿” $broadcast和$on，这是我的班级

export class SharedServiceServiceProvider {
  observable: any;
  observer: any;   
  constructor() {
    this.observable = Observable.create(observer => {
      this.observer = observer;
    }).share();
  } 
  broadcast(event) {
    this.observer.next(event);
  } 
  on(eventName, callback) {
    this.observable.filter((event) => {
      return event.name === eventName;
    }).subscribe(callback);
  }  
}

问题

我能够看到 FIRST，SECOND 警报，但不能看到第3个。

修改

我在GitHub-oneSignal-ionic2上创建了一个示例演示。你唯一要做的事情（如果你想玩它）就是改变OneSignal key并为你的通知创建一个模板。

更新编辑

我现在已将.handleNotificationOpened(function (jsonData) {更改为.handleNotificationOpened((jsonData) => {，显示alert()，但是问题是我有这样的事情：

this.sharedService.on('example', (event) => {
            alert("test");
            this.showStatus();
            this.getActiveGuy(function () {
            });
        });

但似乎这两个方法被调用但没有完成工作，那些方法刷新了页面并且它没有...我必须进行刷新（向下滚动）然后刷新，< strong>但这就是为什么我的onRefresh()我有这些方法......

Answer 1

此问题来自this undefined，而不是this.sharedService。

在lexical scoping知道的javascript中，让我们引用此blog：

ES6箭头函数语法使用“词法范围”来弄清楚 “这”的价值应该是多少。词汇范围是一种奇特的方式说它使用周围代码中的“this”...代码包含有问题的代码。

或来自typescript documentation：

好/坏：每个实例为每个方法创建一个额外的闭包班上的。如果此方法通常仅用于常规方法打电话，这太过分了。但是，如果它在回调中使用了很多位置，它更有效的类实例捕获 this上下文而不是每个调用站点创建一个新的闭包调用

只是为了解决你的问题（正如yurzui评论所提到的那样）：

var notificationOpenedCallback = function (jsonData) {
. . .
}

为：

let notificationOpenedCallback = (jsonData) => {
. . .
}

Answer 2

问题在这里

var notificationOpenedCallback = function (jsonData) {
    if (jsonData != null) {
       if (jsonData["type"] == "example") {
            alert("second"); //<------ SECOND ALERT
            this.sharedService.broadcast({
                name: 'example'
            });
        }

this关键字引用notificationOpenedCallback 功能，它无法访问sharedService。您可以做的是将此函数notificationOpenedCallback(data)移动到类对象，这应解决问题。

以角度2广播$ on $

问题

修改

更新编辑

2 个答案: