angular2のモジュールとコンポーネントに変数を渡す方法

Question

私のWebページにコンポーネントセレクタがある場合、複数のUIモジュールをboostrapするためにangular2を使用しています。メインのアプリ要素を使用して、その中にすべてのコンテンツを配置することはできません。私は何とか各コンポーネントに変数を渡したいと思っています。

マイinit.ts

System.import('@angular/platform-browser_dynamic').then(function(pbd) { 
    const platform = pbd.platformBrowserDynamic(); 

    // I will put all my modules information here 
    const modules = { 
     'my-app': { 
      selector: 'my-app', 
      file: 'myapp', 
      import: 'MyAppModule' 
     } 
    }; 

    // Loop through my settings object and look for modules/components to be bootstrapped if their selector exists on the current page 
    for(var module in modules) { 
     if(document.querySelectorAll(modules[module].selector).length > 0) { 
      System.import('app/modules/' + modules[module].file) 
        .then(function(m) { 
         platform.bootstrapModule(m[modules[module].import]); 
        }); 
     } 
    } 
}); 

マイmodules/myapp.ts

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { MyAppComponent } from 'app/components/myapp'; 

@NgModule({ 
    imports: [ BrowserModule ], 
    declarations: [ MyAppComponent ], 
    bootstrap: [ MyAppComponent ] 
}) 
export class MyAppComponent { 
    // maybe dynamically bootstrap components here 
} 

マイcomponent/myapp.ts

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

@Component({ 
    selector: 'my-app', 
    template: 'Hello World' 
}) 
export class MyAppComponent { 
    // or import data here 
} 

私の最後のポイントは、何とかその構成要素に属性要素を渡すことができるようになります。私は、以前はangular2コンポーネントで動作していたが、もはや2.0.0ではなく（リリース候補ではなく）ElementRefを使用しようとしました。

私は一種の迷子です。

Answer 1

コンポーネント/ myapp.tsにこのコードを使用します。
@Input（）デコレータは、コンポーネントの親から渡すことができるパラメータのセットを定義します。たとえば、親が名前を提供できるようにHelloコンポーネントを変更することができます。1

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

@Component({ 
selector: 'hello', 
template: '<p>Hello, {{name}}</p>' 
}) 
export class Hello { 
@Input() name: string; 
}