コンポーネントをデータにバインド
ユーザー・インタフェースにデータを表示するには、applicationのページで使用されているコンポーネントをそのデータ・ソースにバインドします。 すべてのコンポーネントには、変数または式にバインドできるプロパティがあります。 これらのプロパティは、コンポーネントの状態(入力テキスト・フィールドの値など)またはそのレンダリング(有効または無効など)に影響する可能性があります。
コンポーネントが変数にバインドされると、その変数に格納されているデータがコンポーネントに表示されます。 たとえば、入力テキスト・コンポーネントをバインドして、RESTエンドポイントから特定のフィールドのデータ(ユーザー名など)を表示できます。 これは、「データ」タブのコンポーネントの「値」プロパティで使用可能な「変数の選択」アイコンをクリックして手動で実行できます。 式に基づいてコンポーネントに値を割り当てる場合(たとえば、姓と名を組み合せてユーザーのフルネームを表示する場合)、「式エディタ」アイコンをクリックして式を作成する必要があります。このアイコンは、「データ」タブの「値」プロパティでも使用できます。
「
図props-data.pngの説明」
たとえば、文字列型のname変数を入力テキスト・コンポーネントのデータ・ソースとして選択すると、{{$variables.name}}に設定された値が表示されます。これは、コンポーネントがページ・レベルの変数nameにバインドされていることを示す簡潔な方法です。 値{{ }}の周りの二重中カッコは、変数をコンポーネントで更新または読取りできることを示します。 この場合、変数はコンポーネントの値が変更されるたびに自動的に更新されます。 逆に、変数が変更されるたびにコンポーネントが自動的にリフレッシュされます。 二重大カッコ[[ ]]は、変数のデータの読取りのみが可能であることを意味します。
クイック・スタートを使用して、表ビューやリスト・ビューなどのコレクション・コンポーネントをデータ・ソースにバインドすることもできます。 「クイック・スタートの動作」を参照してください