このサンプルでは、Power Apps component framework で外部のライブラリまたはフレームワークを使用してコンポーネントを作成する方法を説明します。 フリップのサンプル コンポーネントは、angular.js、angular-ui、angle-animate、angle-sanitize、bootstrap に基づいて実装されます。 このコードは、言及した外部のライブラリまたはフレームワークのベスト プラクティスを明らかにしない場合があります。
使用可能な対象
モデル駆動型アプリとキャンバス アプリ
コード
完全なサンプル コンポーネントは、こちら からダウンロードできます。
このサンプルは、外部のライブラリまたはフレームワークに依存関係を追加する方法の例を示し、Power Apps component framework、コンポーネント モデル、Angular の内部データモデル間で双方向のデータ バインドを実行する方法を紹介します。
フリップ コンポーネントのサンプルは、ラベルとボタンで構成されます。 ボタンを選択すると、ラベルのテキストが切り替わります。
- コンポーネントがロードされると、ラベルはバインド列の値に基づいてテキストを表示します。
context.parameters.[property_name].attributesは関連する定義を含みます。 - Yes/No 列に対して、
context.parameters.[property_name].Optionsは true と false の両方の値のオプションを含みます。 - フリップ ボタンを選択すると、ラベルは notifyOutputEvents メソッドを使用して値を更新し、getOutputs メソッドは非同期に呼び出されて Power Apps component framework にフローします。
- Client API はバインド列の値を更新し、更新された値はコンポーネント ラベルにフローします。
ClientAPIを使用して列の値を更新し、コントロールの updateView メソッドをトリガーすることもできます。 その後、コンポーネントが Angular モデルを更新して、ラベルが更新されます。
関連記事
サンプル コンポーネントをダウンロード
サンプルコンポーネントの使用方法
Power Apps component framework のマニフェスト スキーマ リファレンス
Power Apps Component Framework API リファレンス
Power Apps Component Framework の概要