【问题标题】:Angularjs 1.4.4: Uncaught ReferenceError: $rootScope is not definedAngularjs 1.4.4:未捕获的 ReferenceError:$rootScope 未定义
【发布时间】:2018-04-06 10:49:52
【问题描述】:

我想使用 SockJs 从服务器端接收所有 stomp 发布的事件。我已经创建了 WebSocketController。它在 app.js 中启动为

.controller('webSocketController', webSocketController)

WebSocketController.js

class WebSocketController {

  constructor($rootScope, $scope) {
   Object.assign(this, {$rootScope, $scope});
    this.onConnected = this.onConnected.bind(this);
    this.stompClient = '';
    let vm = this;

    setTimeout(function () {
            vm.connect();
    }, 2000);
  }

  onConnected(frame) {
    console.log('Connected: ' + frame);
    this.stompClient.subscribe('/topic/public', this.showMessage);
  }

  onError(error) {
      console.log("Could not connect to WebSocket server. Please refresh this page to try again!");
      console.log("error: ", error);
  }

  connect() {
    var socket = new SockJS('/ws');
    this.stompClient = Stomp.over(socket);
    this.stompClient.connect({}, this.onConnected, this.onError);
  }

  showMessage(message) {
      console.log("message received: ",message);
      $rootScope.$broadcast('refreshAccessPointList');
  }

  getStompClient() {
    return this.stompClient;
  }

}

var MyController = new WebSocketController();
MyController.$inject = ['$scope', '$rootScope'];
export default MyController;

当 showMessage() 尝试广播接收到的事件时,它找不到 $rootScope。 控制台说:Uncaught ReferenceError: $rootScope is not defined at l (webSocket.controller.js?eaab:33) 知道我错过了什么吗?

【问题讨论】:

    标签: angularjs angularjs-scope angularjs-controller sockjs


    【解决方案1】:

    在你的类之后,将依赖项注入你的控制器类然后注入你的模块

    export class WebSocketController {
    
      constructor($rootScope, $scope) {
       Object.assign(this, {$rootScope, $scope});
        this.onConnected = this.onConnected.bind(this);
        this.stompClient = '';
        let vm = this;
    
       ....
       ....
       ....
    
    
      getStompClient() {
        return this.stompClient;
      }
    
    }
    

    现在,

    将依赖项注入您的控制器类:

    WebSocketController.$inject = ['$rootScope', '$scope'];

    将控制器依赖注入您的模块:

    angular.module('app').controller('WebSocketController', WebSocketController);

    【讨论】:

    • WebSocketController 的依赖注入将在 WebSocketController .js 中完成,控制器依赖注入在 app.js 中完成。如何确定注入的优先顺序?
    • 而不是初始化新对象,尝试直接导出类,或者如果不只是在同一个文件中添加模块依赖项,正如我在答案中所说的
    【解决方案2】:

    您应该在创建控制器实例之前设置 $inject 注释

    WebSocketController.$inject = ['$rootScope', '$scope'];
    export class WebSocketController;
    

    另外,我认为您不需要手动创建 WebSocketController 的实例。

    someModule.controller('WebSocketController', WebSocketController);
    

    【讨论】:

      猜你喜欢
      • 2017-02-18
      • 1970-01-01
      • 2023-04-04
      • 2023-01-23
      • 2016-11-03
      • 2011-01-05
      • 2016-01-02
      • 2013-10-06
      • 2016-12-17
      相关资源
      最近更新 更多