AngularJS (1.5) beroendeinjektion i modellklasser (TypeScript)

Jag försöker använda TypeScript för att bygga en AngularJS (1.5) applikation.

Jag vill skapa motsvarigheten till en fabrik som anropar en modell (som kan ta parametrar).

Jag skulle kunna göra följande om jag skulle göra det i ren JS

angular.module('test', [])
    .factory('Talker', [$q, function($q){
      return Talker()

      function Talker(name) {
        this.name = name || 'Bobuel Johnson'; 
      }
      Talker.prototype.deferredHello = function(){
        $q.when('Hi, I\'m ' + this.name);
      }
    }])

Nu vill jag göra detta i TypeScript så att jag kan ha Talker-klassen men jag vill kunna injicera (i det här fallet) $q i modellklassen.

Snälla, kan du hjälpa mig att lista ut hur man får detta att fungera som TypeScript-ekvivalenten?

Svar #1

Jag skulle rekommendera att använda ett service-recept istället för en factory, om inte annat för att förbereda för angular2. En TypeScript-omskrivning av den där js-koden skulle se ut ungefär så här.

class Talker {
  public static $inject = ['$q']; // configure angular di
  private name: string = 'Some talker';  

  constructor(private $q) {}

  public deferredHello() {
    this.$q.when('Hi, I\'m ' + this.name);
  }
}

angular.module('test').service('Talker', Talker);

Du kan hitta översättningen till js här.

Om en fabrik är absolut nödvändig bör du kunna göra det också på detta sätt:

class Talker {

  private name: string = 'Some talker';

  constructor(private $q) {}

  public deferredHello() {
    this.$q.when('Hi, I\'m ' + this.name);
  }
}

angular.module('test').service('Talker', function($q) {
  return new Talker($q);
});

Du kan kolla in den genererade javascripten här.

Om du behöver skapa flera instanser av Talker kan du göra det på detta sätt.

class Talker {

  private name: string = 'Some talker';

  constructor(private $q, money: number) {}

  public deferredHello() {
    this.$q.when('Hi, I\'m ' + this.name);
  }
}

angular.module('test').service('Talker', function($q) {
  // we can ask for more parameters if needed
  return function talkerFactory(money) { // return a factory instead of a new talker

    return new Talker($q, money);
  };

});

angular.module('yatest').service('Organiser', function(Talker) {
  let talker = Talker(42); // will call talkerFactory and return a new instance of talker 
})

Exemplet för det är här.