次の方法で共有


チュートリアル: ポータルでコード コンポーネントを使用する

注意

2022 年 10 月 12 日より、Power Apps ポータルは Power Pages となります。 詳細: Microsoft Power Pages の一般提供が開始されました (ブログ)
Power Apps ポータルのドキュメントは、近日中に Power Pages ドキュメントに移行、統合されます。

このチュートリアルでは、Power Apps Component Framework を使用してサンプル コンポーネントを作成します。 このコンポーネントを Dataverse の環境にパッケージし、モデル駆動型のアプリにコンポーネントを追加します。 その後、Power Apps ポータルを構成して、コンポーネントを基本フォームに追加し、Web ページに追加します。 最後に、ポータルの Web ページにアクセスして、コンポーネントを操作します。

前提条件

  • ポータル バージョンは 9.3.3.x 以降である必要があります。
  • スターター ポータル パッケージは 9.2.2103.x 以降である必要があります。

注意

このチュートリアルは、既存の Power Apps component framework のチュートリアルに基づくものです。ここでは、メイン フォームの 営業案件 テーブルで使用する TSLinearInputComponent の作成をします。 このチュートリアルでは、既存または新規のコンポーネント、およびその他のテーブルを使用することもできます。 この場合、このチュートリアルのステップを実行する際には、必ずご利用のコンポーネントとフォーム ページを使用してください。

ステップ 1: 最初のコンポーネントを作成する

サンプル コンポーネントを作成するには、チュートリアル最初のコンポーネントを作成するの手順に従ってください。 このチュートリアルの最後に、TSLinearInputComponent という名前のコンポーネントがパッケージ化され、Dataverse 環境にアップロードされます。

ステップ 2: モデル駆動型アプリのフィールドにコード コンポーネントを追加する

以上で、TSLinearInputComponent が Dataverse 環境にアップロードされました。チュートリアル モデル駆動型アプリのフィールドにコード コンポーネントを追加する に記載の手順に従って、メイン フォームの 営業案件 テーブルにコンポーネントを追加します。

ステップ 3: 新しいコンポーネントを使用してモデル駆動型アプリを検証する

コンポーネントを追加したフォームを使用して、既存のモデル駆動型アプリの更新、または新しいアプリの作成 することができます。 たとえば、次の画像では、このチュートリアルのコード コンポーネントを使用した 営業案件テーブルのメイン フォームの外観を示しています。

モデル駆動型アプリ フォームの予算金額フィールドに追加されたスライダー コントロール。

ステップ 4: ポータルの基本フォームにコード コンポーネントを追加

この手順では、ポータルで新しい基本フォームを作成してから、作成した基本フォームにコンポーネントを追加していきます。 代わりに既存の基本フォームを使用することもできます。

ステップ 4.1: 新しい基本フォームの作成

  1. ポータル管理アプリを開きます。

  2. 左側のペインのコンテンツから、基本フォームを選択します。

  3. 新規をクリックします。

  4. 名前 を入力します。 例: コード コンポーネントを含む営業案件基本フォーム

  5. 基本名営業案件として選択します。

  6. フォーム名に関しては、このチュートリアルの前半でコード コンポーネントを追加したモデル駆動型アプリ フォームを選択します。

  7. タブ名を選択します。

  8. ポータル Web サイトを選択します。

    ポータル管理アプリを使用した基本フォームの構成。

  9. 保存して閉じるを選択します。

ステップ 4.2: 基本フォームにコード コンポーネントを追加

  1. ポータル管理アプリを開きます。

  2. 左側のペインのコンテンツから、基本フォームを選択します。

  3. 前述の手順で作成した基本フォームを選択します。

  4. 関連を選択します。

  5. 基本フォーム メタデータを選択します。

  6. 新しい基本フォーム メタデータを選択します。

  7. 種類属性として選択します。

  8. 属性の論理名予算額 (budgetamount) を選択します。

    予算金額の属性論理名。

  9. ラベルを入力します。 例えば、予算金額

  10. コントロール スタイル には、コード コンポーネント を選択します。

    コントロール スタイル。

  11. 保存して閉じる を選択します。

ステップ 5 基本フォームを使用してポータルで Web ページを作成する

  1. ポータルを Power Apps ポータル Studio で開きます。

  2. 左上隅にある 新規ページ を選択します。

  3. 空白を選択します。

  4. 右側のプロパティ ウィンドウで、Web ページ名を更新します。 例えば、営業案件

  5. 部分 URL を更新します。 例えば、営業案件 を更新します。

  6. アクセス許可を展開します。

  7. すべてのユーザーが利用可能なページを無効にします。

  8. このページへのアクセスを許可する必要がある Web ロールを選択します。

  9. ページ エディター内の、ヘッダー セクションの下で、セクションを選択します。

  10. 左側のペインで、コンポーネントを選択します。

  11. ポータル コンポーネントで、フォームを選択します。

  12. 右側のプロパティ ウィンドウで、既存のものを使用を選択します。

  13. 名前で、このチュートリアルの前半で作成した基本フォームを選択します。

    ヒント

    利用可能なフォームが表示されない場合は、同期の構成を試して、Dataverse からの変更を同期してください。

  14. 右上隅で、Web サイトの参照を選択します。

Web ページに、コード コンポーネントとともにスライダーの形式で営業案件テーブルの基本フォームが表示されます。これは、同じフォームに対してモデル駆動型アプリケーションを使用した場合と共通するものです。

ポータル ページの予算金額スライダー コントロールのプレビュー例。

次の手順

概要: ポータルのコード コンポーネントを使用する

関連項目

Power Apps Component Framework の概要
最初のコンポーネントを作成する
モデル駆動型アプリのフィールドまたはテーブルにコード コンポーネントを追加する

注意

ドキュメントの言語設定についてお聞かせください。 簡単な調査を行います。 (この調査は英語です)

この調査には約 7 分かかります。 個人データは収集されません (プライバシー ステートメント)。