Tutorial: Menggunakan komponen kode di portal

Catatan

Mulai 12 Oktober 2022, portal Power Apps menjadi Power Pages. Informasi selengkapnya: Microsoft Power Pages kini tersedia secara umum (blog)
Kami akan segera memigrasikan dan menggabungkan dokumentasi portal Power Apps dengan dokumentasi Power Pages.

Dalam tutorial ini, Anda akan membuat komponen sampel menggunakan Power Apps component framework. Anda akan mengemas komponen ini ke lingkungan Dataverse dan menambahkan komponen ke aplikasi berdasarkan model. Kemudian Anda akan mengkonfigurasi portal Power Apps untuk menambahkan komponen ke formulir dasar, dan menambahkan formulir dasar ke halaman web. Terakhir, Anda akan mengunjungi halaman web portal dan berinteraksi dengan komponen.

Prasyarat

  • Versi portal Anda harus 9.3.3.x atau yang lebih tinggi.
  • Paket portal pemula Anda harus 9.2.2103.x atau lebih tinggi.

Catatan

Tutorial ini didasarkan pada tutorial Power Apps component framework yang memandu Anda membuat TSLinearInputComponent untuk tabel Peluang pada formulir Utama. Anda juga dapat menggunakan komponen yang ada atau baru, dan tabel lain untuk tutorial ini. Dalam hal ini, pastikan untuk menggunakan komponen dan formulir saat mengikuti langkah-langkah dalam tutorial ini.

Langkah 1. Membuat komponen pertama Anda

Untuk membuat komponen sampel, ikuti langkah-langkah dalam tutorial Buat komponen pertama Anda. Di akhir tutorial ini, Anda akan memiliki komponen bernama TSLinearInputComponent yang dikemas dan diunggah ke lingkungan Anda Dataverse .

Langkah 2. Menambahkan komponen kode ke bidang dalam aplikasi berdasarkan model

Sekarang setelah Anda mengunggah TSLinearInputComponent ke lingkungan Anda Dataverse , ikuti langkah-langkah dalam tutorial Menambahkan komponen kode ke bidang di aplikasi berbasis model untuk menambahkan komponen ke tabel Peluang pada formulir Utama .

Langkah 3. Verifikasikan aplikasi yang diarahkan model dengan komponen baru

Anda dapat memperbarui aplikasi berdasarkan model yang ada atau membuat aplikasi baru dengan formulir yang ditambahkan komponen tersebut. Contohnya, gambar berikut menunjukkan tampilan formulir utama tabel Peluang saat menggunakan komponen kode dalam tutorial ini.

Kontrol slider ditambahkan ke bidang Jumlah Anggaran dalam formulir aplikasi yang diarahkan model.

Langkah 4. Menambahkan komponen kode ke formulir dasar di portal

Pada langkah ini, Anda akan membuat formulir dasar baru di portal, lalu menambahkan komponen ke formulir dasar yang dibuat. Anda juga dapat menggunakan formulir dasar yang ada sebagai gantinya.

Langkah 4.1. Buat formulir dasar

  1. Buka aplikasi Portal Management.

  2. Di panel kiri, dalam Konten, pilih Formulir dasar.

  3. Pilih baru.

  4. Masukkan nama. Contohnya, Formulir dasar Peluang dengan komponen kode.

  5. Pilih Nama Dasar sebagai Peluang.

  6. Untuk Nama Formulir, pilih formulir aplikasi yang diarahkan model yang telah ditambahkan komponen kodenya sebelumnya dalam tutorial ini.

  7. Pilih nama tab.

  8. Pilih situs web portal.

    Mengonfigurasi formulir dasar menggunakan aplikasi Manajemen Portal.

  9. Pilih Simpan & Tutup.

Langkah 4.2. Menambahkan komponen kode ke formulir dasar

  1. Buka aplikasi Portal Management.

  2. Di panel kiri, dalam Konten, pilih Formulir dasar.

  3. Pilih formulir dasar yang Anda buat pada langkah sebelumnya.

  4. Pilih Terkait.

  5. Pilih Metadata Formulir Dasar.

  6. Pilih Metadata Formulir Dasar Baru.

  7. Pilih jenis sebagai atribut.

  8. Pilih Nama Logis Atribut sebagai Jumlah Anggaran (budgetamount).

    Nama logis atribut Jumlah Anggaran.

  9. Masukkan Label. Contohnya, Jumlah Anggaran.

  10. Untuk Gaya Kontrol, pilih Komponen Kode.

    Gaya Kontrol.

  11. Pilih Simpan & Tutup.

Langkah 5. Membuat halaman web di portal dengan formulir dasar

  1. Buka portal Anda di Studio portal Power Apps.

  2. Di sudut kiri atas, pilih Halaman baru.

  3. Pilih Kosong.

  4. Pada panel properti sisi kanan, perbarui nama halaman web. Contohnya, Peluang.

  5. Perbarui URL sebagian. Contohnya, Peluang.

  6. Perluas Izin.

  7. Nonaktifkan Halaman tersedia untuk semua orang.

  8. Pilih peran web yang harus diizinkan akses ke halaman ini.

  9. Di dalam editor halaman, di bawah bagian Header, pilih bagian Kolom.

  10. Di panel kiri, pilih komponen.

  11. Dalam komponen portal, pilih Formulir.

  12. Pada panel properti sisi kanan, pilih Gunakan yang ada.

  13. Di Nama, pilih formulir dasar yang Anda buat sebelumnya dalam tutorial ini.

    Tip

    Jika formulir tidak tersedia, coba Sinkronisasi Konfigurasi untuk mensinkronisasikan perubahan dari Dataverse.

  14. Di sudut kanan atas, pilih Telusur situs web.

Halaman web sekarang akan menampilkan formulir dasar untuk tabel Peluang dengan komponen kode sebagai panel geser, mirip dengan tampilannya menggunakan aplikasi berdasarkan model untuk formulir yang sama.

Pratinjau contoh kontrol panel geser Jumlah Anggaran di halaman portal.

Langkah berikutnya

Gambaran umum: Gunakan komponen kode di portal

Lihat juga

Gambaran Umum Power Apps component framework
Membuat komponen pertama Anda
Menambahkan komponen kode ke bidang atau tabel dalam aplikasi yang diarahkan model

Catatan

Apa bahasa dokumentasi yang Anda inginkan? Lakukan survei singkat. (perlu diketahui bahwa survei ini dalam bahasa Inggris)

Survei akan berlangsung kurang lebih selama tujuh menit. Tidak ada data pribadi yang dikumpulkan (pernyataan privasi).