メタデータ

メタデータは Angular にクラスをどのように処理するか教えるためのものです。

例えば、Angular システムでいう「モジュール」も「コンポーネント」もどちらも、言い方を変えれば「TypeScript のクラス」です。

しかし、メタデータをアタッチすることで、「Angular モジュール」とか「Angular コンポーネント」になります。

モジュールでは次のように @NgModule というメタデータを付けます。

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

コンポーネントでは次のように @Component というメタデータを付けます。

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app works!';
}

上記のように @NgModule と @Component の両方とも、設定オブジェクト (configuration object) を受けとります。しかしながら、設定項目はメタデータの種類によって異なります。

ここでは、「クラスに @ナントカを付けて、そのクラスに追加情報や設定情報を追加するモノがある。それをメタデータという」という程度で抑えておけば OK です。

ホーム » Angular の基礎