home wiki.fukuchiharuki.me
Menu

Injectableってなに

Angular2でDIするときのinjectする要素。

Injectableを作る

  • @Injectable(メタデータ)をつけて
    @Injectable()
  • classをexportする
    export class MyService{
      loadData(): string[] {
        return ['hoge', 'moge', 'fuga'];
      }
    }

@Injectableというメタデータを書くだけです。

Injectableをinjectする

  • exportしたクラスをimportして
    import {MyService} from './my.service';
  • メタデータのprividersに追加して
    @Component({
      ...
      providers: [MyService]
    })
  • constructorの引数にする
    export class AppComponent{
      private list: string[];
      constructor(private myService: MyService) {
        this.list = myService.loadData();
      }
    }

コンストラクタの引数にするだけでDIされますが、この記述はInjectを省略しているだけのようです。

ソースコード

参考