Ionic v3集成OneSignal推送：订阅回调作用域问题求助

我之前在Ionic v3集成OneSignal推送时也碰到过完全一样的问题——回调函数里死活访问不了注入的userService，核心原因就是普通回调函数的作用域和组件实例的作用域不重叠，导致this指向的不是组件本身。下面给你两种直接可行的解决方法，还有一些关键注意事项：

方法1：使用箭头函数（推荐） #

箭头函数会自动继承外部作用域的this，也就是组件实例的this，这样就能直接访问注入的userService了：

import { Component, OnInit } from '@angular/core';
import { UserService } from '../services/user.service'; // 替换成你的service实际路径
declare var OneSignal: any;

@Component({
  selector: 'app-notification',
  templateUrl: './notification.component.html'
})
export class NotificationComponent implements OnInit {

  constructor(private userService: UserService) { }

  ngOnInit() {
    // 用箭头函数作为回调
    OneSignal.addSubscriptionObserver((stateChanges) => {
      // 只在用户从"未订阅"切换到"已订阅"时执行更新
      if (stateChanges.from.subscribed === false && stateChanges.to.subscribed === true) {
        const pushUserId = stateChanges.to.userId;
        
        // 这里的this就是组件实例，能直接调用userService
        this.userService.updateUserPushId(pushUserId).subscribe(
          (res) => console.log('Push ID更新成功', res),
          (err) => console.error('Push ID更新失败', err)
        );
      }
    });
  }
}

方法2：保存组件的this引用（兼容旧写法） #

如果你习惯用普通函数作为回调，可以先把组件的this存到一个变量里（比如that），然后在回调里用这个变量访问服务：

ngOnInit() {
  const that = this; // 保存组件实例的this
  OneSignal.addSubscriptionObserver(function(stateChanges) {
    if (stateChanges.from.subscribed === false && stateChanges.to.subscribed === true) {
      const pushUserId = stateChanges.to.userId;
      // 用that代替this，就能访问userService了
      that.userService.updateUserPushId(pushUserId).subscribe(
        (res) => console.log('Push ID更新成功', res),
        (err) => console.error('Push ID更新失败', err)
      );
    }
  });
}

额外注意事项 #

1. 确保OneSignal已正确初始化
   一定要在平台就绪后完成OneSignal的初始化，比如在app.component.ts的initializeApp方法里：

   initializeApp() {
     this.platform.ready().then(() => {
       if (this.platform.is('ios')) {
         OneSignal.setAppId('你的OneSignal App ID');
         // 触发通知权限请求
         OneSignal.promptForPushNotificationsWithUserResponse((accepted) => {
           console.log('用户是否同意通知：', accepted);
         });
       }
     });
   }
   

2. 确认UserService的注入正确

   • 组件的constructor里要正确声明private userService: UserService
   • UserService必须在对应的NgModule的providers数组中注册，否则无法注入

3. 检查订阅状态判断逻辑
   只有当stateChanges.from.subscribed是false且stateChanges.to.subscribed是true时，才说明用户刚同意了通知，这时候才需要更新数据库，避免重复执行。

内容的提问来源于stack exchange，提问作者ace