Come utilizzare un web worker in AngularJS?

Question

Sto usando AngularJS Seed e voglio vedere un'implementazione funzionante di un Web Worker.

Voglio far funzionare un semplice Web Worker per comprenderlo, ma sto riscontrando un problema con la funzionalità.

Ho il codice Web Worker nei services.js in questo modo:

'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; 
     } 
    }; 

}]); 

Negli js cartella Ho un file doWork.js ei suoi contenuti sono:

self.addEventListener('message', function(e) { 
    self.postMessage(e.data); 
}, false); 

Il mio controller.js il file è vuoto e sembra che sia:

'use strict'; 

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

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


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


}]); 

Quello che voglio è vedere l'output del Web Worker.

L'errore che ottengo con questa configurazione è:

Uncaught TypeError: Impossibile chiamare il metodo 'fabbrica' di indefinito

Answer 1

Hai un errore di sintassi?

cambiamento

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

a

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

Answer 2

È necessario avere qualcosa per risolvere la promessa restituito dal vostro servizio. Qualcosa sulla falsariga di

var promise = HelloWorldService.doWork(input); 
promise.then(function(allWentGoodMessage){ 
    // green path code goes here 
}, function(somethingWentBadMessage){ 
    // error handling code goes here 
}); 

Inoltre, avrete bisogno di iniettare il servizio nel controller che chiama il servizio.

Dai uno sguardo allo this post per un altro modo di occuparti degli utenti del Web in AngularJS.

E si potrebbe anche voler fare la conoscenza con l'attuazione promessa, $q in AngularJS