home wiki.fukuchiharuki.me
Menu

Injectableってなに

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

Injectableを作る

  • @Injectable(メタデータ)をつけて(多段Injectでなければ要らない?)
    @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を省略しているだけのようです。また、providersにProviderを与えずにMyServiceを与えているのも省略した書き方です(参考記事を見てね)。

ソースコード

参考