0

Inputs.A を使用して Angular2 コンポーネント チェーンを作成したかったのです。 app > parent > child からの簡単なチェーン例です。アプリ内のどこで、インターンが実行時に子に設定されるデータを設定します。以下の同じコード。

------------ app.component.ts ---------

import {Component} from 'angular2/core';
import {ParentComponent} from './parent.component';
@Component({
    selector:'componentchain-tag',
    template: `<h1>Level 0</h1>
    <p><parent-tag [fromapp] = "From Level 0" ></parent-tag>
     `,
    directives: [ParentComponent]
}) 
export class AppComponent {
fromapp: string;
}

------------- 親.コンポーネント.ts ----------------

import {Component,Input} from 'angular2/core';
import {Child1Component} from './child1.component';
@Component({
    selector:'parent-tag',
    template: `<h1>Level 1</h1>
    <p><child1-tag [child1value] = {{fromapp}} ></child1-tag>
     `,
    directives: [Child1Component]
}) 
export class ParentComponent {
     @Input() fromapp: string;
    child1value: string;
    constructor(){
    }
}

--------------------------- child1.component.ts ---------

import {Component,Input} from 'angular2/core';

@Component({
    selector: 'child1-tag',
    template: `<h1>Level 3-1</h1>
    This is Child1
    <p>This is variable from {{child1value}}
    `
})
export class Child1Component {
    @Input() child1value: string;

}

parent.component.ts で{{fromapp}}、一時変数に保存するなど、いじってみましたが、機能しません。parent.component fromappinが定義されていないというエラーが表示されます。

コンポーネントのマルチチェーンを行う方法、その基本は正しいですか?

4

2 に答える 2

0

これは無効です

<p><child1-tag [child1value] = {{fromapp}} ></child1-tag>

そのはず

<p><child1-tag [child1value]="fromapp"></child1-tag>
  • {{}}値を文字列化します
  • {{}}[]、()、または *xxx ( など*ngFor)と組み合わせることはできません
于 2016-06-04T17:36:37.207 に答える