2013-10-09 10 views
11

Sto cercando di ottenere la mia testa intorno angularjs al momento. Attualmente sto guardando i servizi che sto usando anche dattiloscritto per il codice.Servizio angolare nello script di tipo con iniezione dipendente e minisito

Ora dai campioni sul Web ho visto che le persone usano qualcosa di simile per un servizio in dattiloscritto.

class Service 
{ 
    constructor(private $http: ng.IHttpService) 
    { 
    } 

    public MyMethod() 
    { 
     this.$http.get("/") 
      .success(null) 
      .error(null); 
    } 
} 

Ora, se questo è ridotte di avrei perso $http dal costruttore e angolare richiede i nomi delle variabili. Così ho controllato e ho scoperto che posso usare $ inject al posto del costruttore ma anche questo avrebbe lo stesso problema di minification.

In che modo le persone si occupano di minification e angular in un contesto dattiloscritto? Sto lottando per trovare alcuni documenti solidi su come questo dovrebbe essere gestito. A me sembra strano avere questi problemi in un'API moderna quindi mi manca qualcosa da qualche parte.

+1

È possibile utilizzare prima di uglifyid il modulo "ngAnnotate" per gulp, in modo da impedire la perdita di dipendenze in angolare. Ad esempio: gulp.src (paths.ts) .pipe (ts (ts.createProject ('tsconfig.json'))). Pipe (concat ('app.min.js')). Pipe (ngAnnotate ({rimuovi : true, aggiungere: true, single_quotes: true})). pipe (uglify()). pipe (gulp.dest ('www/js /')) – ekussberg

risposta

16

Solo utilizzando la sintassi $inject. per esempio. :

class Service 
{ 
    static $inject = ['$http'];  
    constructor(private $http: ng.IHttpService) 
    { 
    } 

    public MyMethod() 
    { 
     this.$http.get("/") 
      .success(null) 
      .error(null); 
    } 
} 

PS: Ho fatto un video dettagliato sul tema: http://www.youtube.com/watch?v=WdtVn_8K17E&hd=1

+0

In questo modo, ogni istanza di 'Service' ottiene il proprio' $ riferimento http. In vanilla JavaScript, il metodo 'angular.factory' è comunemente usato per accedere a tali dipendenze in una chiusura. Quali migliori pratiche suggeriresti per ottenere questo in Typescript? – mhelvens

+0

I servizi sono singleton. Ci sarà una sola istanza – basarat

+0

Javascript non sa di classi (o singleton), e quindi nemmeno AngularJS. I servizi possono essere qualsiasi cosa. Ho offerto "classi" istantanee come servizi per anni. – mhelvens

0

Attualmente il compilatore ufficiale dattiloscritto ancora non emette metadati interfaccia che potrebbe essere utilizzato in fase di esecuzione per un sistema di DI. C'è un problema relativo all'estensibilità dell'emettitore here. Nel frattempo ho creato un progetto di esempio (insieme a una versione personalizzata del compilatore TS che emette i metadati dell'interfaccia) di un'applicazione AngularJS 1.3 che fornisce Decoratori per registrare i componenti nel modulo dell'applicazione e iniettare dipendenze utilizzando i metadati della classe in fase di esecuzione. Puoi dare un'occhiata here.

Problemi correlati