角2のバインドプロパティ

Question

私はAngular2を学んでいます。これは私がサンプルコードを作成しているためです。

私は、パラメータ受けるべきである再利用可能なコンポーネントCard持っている：titleパラメータがstringでなければならないこと

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

@Component({ 
    selector: 'card', 
    templateUrl: '../templates/card.html' 
}) 

export class Card { 
    @Input() title; 
} 

を。

これはこれまでのところ、このコンポーネントのHTMLテンプレートです：

<div class='card'> 
    {{ title }} 
    <ng-content></ng-content> 
</div> 

および他のコンポーネントから、私はこのようにそれを呼んでいる：私は、コンソールでこのエラーを取得してい

<card 
    [title]='Enter your raw json'> 
    Example 
</card> 

（ほかにもたくさんあります）：

EXCEPTION: Template parse errors: 
Parser Error: Unexpected token 'your' at column 7 in [Enter your raw json] in JsonTextInput@1:2 ("<card 
    [ERROR ->][title]='Enter your raw json'> 
    Example 
</card>"): JsonTextInput@1:2 

プロパティバインディングにはどのような問題がありますか？

Answer 1

あなたはバインディングプロパティを使用する場合、Angular2のテンプレートパーサがあなたのコンポーネントクラスのプロパティとして内容を解釈します：

@Component({ 
    template: `<card [title]="property"> ... </card>`, 
    ... 
}) 
class SomethingComponent { 
    property = 'something'; // this will be bound to the title input of card 
} 

あなたが結合プロパティに文字列リテラルを渡したい場合は、単一引用符内に置きます次のようになります。

[title]="'some title'"