Ricerca…


Osservazioni

Il nuovo motore Chrome V8 è parzialmente conforme a ES7. Quindi se aggiungiamo "use strict"; all'inizio del nostro file (il dattiloscritto lo fa quando traspone il dattiloscritto) dobbiamo assicurarci che tutte le funzioni che sono nello scope globale siano effettivamente assegnate all'ambito globale. quindi dovremmo usare self.functionName o global.functionName .

utilizzare i lavoratori nel servizio angular2

/app/services/greeting.service.ts :

import { Injectable } from '@angular/core';
import {greetingTypes,request,response} 
            from  './greeting.interface'

@Injectable()
export class Greeting{

    private worker;
    constructor(){
       this.worker = new Worker('../workers    /greeting.worker');
    }

    sayHello(message:string, answerCallback:Function){
        let requestData:request =   
            {'type':greetingTypes.HELLO ,'message':message} ;

        this.worker.postMessage(requestData); 
        this.worker.onmessage = (msg)=>{
            let response:response = msg.data; 

            if(response.type == greetingTypes.HELLO){
                answerCallback(response.answer)
            }
        }
    }

    sayBye(message:string, answerCallback:Function){
        let requestData:request =     {'type':greetingTypes.BYE ,'message':message}; 

        this.worker.postMessage(requestData); 
        this.worker.onmessage = (msg)=>{
            let response:response = msg.data; 

            if(response.type == greetingTypes.BYE)
                answerCallback(response.answer)
        }
    }
} 

app/services/greeting.interface.ts :

export enum greetingTypes{
    BYE,
    HELLO
}

export interface request{
   type:greetingTypes,
   message:string 
}

export interface response{
    type:greetingTypes,
    answer:string
}

app/workers/greeting.worker.ts :

require("globals");
import {greetingTypes,request,response} from 
            '../services/greeting.interface';

self.onmessage = (msg)=> {
   let request:request = msg.data;
   let responseData:response;
   if(request.type ==  greetingTypes.HELLO)
        console.log('worker got the message: ' + 
                        request.message);
        responseData = {'type':greetingTypes.HELLO, 
                            'answer': 'HELLO!'};
        global.postMessage(responseData);

   if(request.type == greetingTypes.BYE )
        console.log('worker got the message: ' +request.message);
        responseData = {'type':greetingTypes.BYE ,  
                           'answer':'goodBye!'};
            global.postMessage(responseData);

    };

app/app.component.ts :

import {Component} from "@angular/core";
import {Greeting} from './services/greeting.service';
@Component({
    selector: "my-app",
    templateUrl: "app.component.html",
    providers:[Greeting]
})
export class AppComponent {

    constructor(private greeting:Greeting){}


public tapHello() {

    this.greeting.sayHello('hi',
        (answer)=>{console.log('answer from worker : '+ answer)});
}


public tapBye() {
    this.greeting.sayBye('bye',
        (answer) => {console.log('answer from worker : ' + answer)});
}

}

app/app.component.html :

<StackLayout>
    <Button text="sayBye" (tap)="tapBye()"></Button>
    <Button text="sayHello" (tap) = "tapHello()"></Button>
</StackLayout>


Modified text is an extract of the original Stack Overflow Documentation
Autorizzato sotto CC BY-SA 3.0
Non affiliato con Stack Overflow