如何在AngularJS中使用Web Worker?

acu*_*ars 6 factory worker web-worker angularjs angular-services

我正在使用AngularJS Seed,我希望看到一个Web Worker的工作实现.

我想让一个简单的Web Worker工作,以便理解它,但我遇到了一个功能问题.

我在services.js中有Web Worker代码,如下所示:

'use strict';

/* Services */
var app = angular.module('myApp.services', []).

app.factory("HelloWorldService",['$q',function($q){

    var worker = new Worker('js/doWork.js');
    var defer;
    worker.addEventListener('message', function(e) {
      console.log('Worker said: ', e.data);
      defer.resolve(e.data);
    }, false);

    return {
        doWork : function(myData){
            defer = $q.defer();
            worker.postMessage(myData); // Send data to our worker. 
            return defer.promise;
        }
    };

}]);
Run Code Online (Sandbox Code Playgroud)

js文件夹中,我有一个文件doWork.js,其内容是:

self.addEventListener('message', function(e) {
  self.postMessage(e.data);
}, false);
Run Code Online (Sandbox Code Playgroud)

我的controllers.js文件是空的,看起来像这样:

'use strict';

/* Controllers */
var app = angular.module("myApp.controllers",[]);

app.controller('MyCtrl1', [ '$scope', function($scope) {


}]).controller('MyCtrl2', [ '$scope', function($scope) {


}]);
Run Code Online (Sandbox Code Playgroud)

我想要的是看到Web Worker的输出.

我通过此设置获得的错误是:

未捕获的TypeError:无法调用未定义的方法'factory'

cor*_*eyb 2

你有语法错误吗?

改变

/* Services */
var app = angular.module('myApp.services', []).
Run Code Online (Sandbox Code Playgroud)

/* Services */
var app = angular.module('myApp.services', []);
Run Code Online (Sandbox Code Playgroud)

  • 你有没有告诉工人做任何事情吗?它可能只是坐着等你。您需要将 $HelloWorldService 注入控制器并调用 $HelloWorldService.doWork( "something" ) 。`app.controller('MyCtrl1', [ '$scope', '$HelloWorldService', function($scope, $HelloWorldService) { $HelloWorldService.doWork("something"); }]).controller('MyCtrl2', [ '$scope', function($scope) { }]);` (5认同)