web-dev-qa-db-ja.com

Angular rootディレクティブの2つの入力パラメーター

This の例は、子コンポーネントで@Input()アノテーションを使用する方法を示しています。私の質問は、ルートコンポーネントでどのように使用するかです。たとえば、上のリンクのコードを変更した場合:

@Component({
selector: 'app',
template: `
    <bank-account bank-name="RBC" account-id="4747"></bank-account>
`,
directives: [BankAccount]
})
class App {
    @Input() something: string;
}

bootstrap(App);

そしてhtmlで:

<app something="Test"></app>

上記の例では、Appコンポーネントのsomethingプロパティが更新されることはありません。

14
redman

このTobias Boschのコメント があなたの質問に答えています:

これが機能しない理由は、<app something="Test"></app>を配置するindex.htmlがangularコンポーネントではないためです。このため、Angularはこの要素をコンパイルしません。また、Angularは実行時に属性値を読み取らず、コンパイル時にのみ読み取ります。そうしないと、パフォーマンスヒットが発生します。

そのため、現時点ではルート要素で入力パラメーターを使用できません。

20
alexpods

私はあなたがまだ使うことができると思います:

class App {
    constructor(Elm: ElementRef) {
        this.something = Elm.nativeElement.getAttribute('something'); 
    }
}
21
martin