แท็กแม่แบบ Liquid สำหรับส่วนประกอบของโค้ด (ตัวอย่าง)

[บทความนี้เป็นคู่มือรุ่นก่อนวางจำหน่าย และอาจจะมีการเปลี่ยนแปลงในอนาคต]

Power Apps component framework ช่วยให้นักพัฒนามืออาชีพและผู้สร้างแอปสร้างส่วนประกอบของโค้ดสำหรับแอปแบบจำลองและแอปพื้นที่ทำงาน ส่วนประกอบของโค้ดเหล่านี้สามารถมอบประสบการณ์ที่ได้รับการปรับปรุงสำหรับผู้ใช้ที่ทำงานกับข้อมูลบนฟอร์ม มุมมอง และแดชบอร์ด ข้อมูลเพิ่มเติม: ใช้ส่วนประกอบของโค้ดในพอร์ทัล (พรีวิว)

ในรุ่นนี้ เราได้แนะนำความสามารถในการเพิ่มส่วนประกอบของโค้ด โดยใช้ แท็กเทมเพลต Liquid บนเว็บเพจ และส่วนประกอบที่เปิดใช้งานโดยใช้ API สำหรับเว็บ ที่เปิดใช้งานสำหรับส่วนประกอบระดับฟิลด์บนฟอร์มในพอร์ทัล

ส่วนประกอบของโค้ดสามารถเพิ่มได้ โดยใช้แท็กเทมเพลต Liquid ของ codecomponent คีย์สำหรับแสดงส่วนประกอบของโค้ดที่ต้องโหลดถูกส่งผ่านโดยใช้แอตทริบิวต์ name คีย์อาจเป็น GUID (ซึ่งเป็นรหัสส่วนประกอบของโค้ด) หรือชื่อของส่วนประกอบของโค้ดที่นำเข้าไปยัง Microsoft Dataverse

ค่าของคุณสมบัติที่ส่วนประกอบของโค้ดคาดว่าจะต้องส่งผ่านเป็นคู่ คีย์/ค่า ที่คั่นด้วย ":" (เครื่องหมายทวิภาค) โดยที่คีย์คือชื่อคุณสมบัติ และค่าคือค่าสตริง JSON

{% codecomponent name: <ID or name> <property1:value> <property2:value> %}

ตัวอย่างเช่น ในการเพิ่มส่วนประกอบของโค้ด โดยคาดหวังพารามิเตอร์ข้อมูลป้อนเข้าที่ชื่อ controlValue ใช้แท็กเทมเพลต Liquid ต่อไปนี้:

{% codecomponent name:abc_SampleNamespace.MapControl controlValue:'Space Needle' controlApiKey:<API Key Value>%}

คุณสามารถใช้ การควบคุมแผนที่ตัวอย่าง และ บรรจุส่วนประกอบของโค้ดเป็นโซลูชัน สำหรับใช้กับพอร์ทัลได้

บทช่วยสอน: ใช้ส่วนประกอบของโค้ดบนหน้าเว็บที่มีแท็กแม่แบบ Liquid

ในบทช่วยสอนนี้ คุณจะกำหนดค่าพอร์ทัล Power Apps เพื่อเพิ่มส่วนประกอบไปยังหน้าเว็บ และตั้งค่าการเข้าถึงสำหรับตาราง ทรัพยากรบนเว็บ จากนั้น คุณจะไปที่หน้าเว็บพอร์ทัลและโต้ตอบกับส่วนประกอบ

ก่อนที่คุณเริ่มต้น

หากคุณกำลังใช้ส่วนประกอบของโค้ดตัวอย่างที่ใช้ในบทช่วยสอนนี้ ให้ตรวจสอบให้แน่ใจว่าคุณนำเข้าโซลูชันตัวอย่างไปยังสภาพแวดล้อมก่อนจึงจะเริ่ม หากต้องการเรียนรู้เกี่ยวกับการนำเข้าโซลูชัน ไปที่ นำเข้าโซลูชัน

ข้อกำหนดเบื้องต้น

สำหรับข้อกำหนดเบื้องต้น และเรียนรู้เกี่ยวกับส่วนประกอบของโค้ดที่สนับสนุน/ไม่ได้รับการสนับสนุนในพอร์ทัล ไปที่ ใช้ส่วนประกอบของโค้ดในพอร์ทัล (ตัวอย่าง)

ขั้นตอนที่ 1 เพิ่มส่วนประกอบของโค้ดไปยังหน้าเว็บจาก Studio

1. เปิดพอร์ทัลของคุณใน พอร์ทัลสตูดิโอ Power Apps

2. ที่มุมบนซ้าย ให้เลือก หน้าใหม่

3. เลือก ว่างเปล่า

4. ในบานหน้าต่างคุณสมบัติด้านขวา ให้อัปเดตชื่อเว็บเพจ ตัวอย่างเช่น "โปรแกรมดูแผนที่"

5. อัปเดต URL บางส่วน ตัวอย่างเช่น "mapviewer"

6. ขยาย สิทธิ์

7. ปิดใช้งาน เพจใช้ได้กับทุกคน

8. เลือกบทบาทเว็บที่ควรได้รับอนุญาตให้เข้าถึงหน้านี้

9. เลือกพื้นที่ที่สามารถแก้ไขได้ในหน้าเพื่อแก้ไขโค้ดต้นฉบับ Liquid

10. เปิด ตัวแก้ไขโค้ด ของสตูดิโอ

11. เพิ่มการควบคุมด้วยแท็กเทมเพลต Liquid โดยใช้ไวยากรณ์ต่อไปนี้:

    {% codecomponent name:abc\_SampleNamespace.MapControl controlValue:'Space Needle' controlApiKey:<API Key Value> %}
    

    เคล็ดลับ

    ในการดึงรายละเอียดของส่วนประกอบที่นำเข้าทั้งหมด และเพื่อค้นหาชื่อส่วนประกอบ โปรดดูที่ API สำหรับเว็บ CustomControl

    ตัวอย่างเช่น

    • หากต้องการค้นหาส่วนประกอบ:

      https://contoso.api.crm10.dynamics.com/api/data/v9.2/customcontrols?$select=ContosoCustomControlName

    • ในการดึงพารามิเตอร์ข้อมูลป้อนเข้าสำหรับส่วนประกอบ:

      https://contoso.api.crm10.dynamics.com/api/data/v9.2/customcontrols?$filter=name eq 'ContosoCustomControlName' &$select=manifest

12. บันทึก และปิดตัวแก้ไขโค้ด

13. ที่มุมขวาบน ให้เลือก เรียกดูเว็บไซต์

14. หน้าเว็บจะแสดงตัวควบคุมที่เพิ่มเข้าไป

ขั้นตอนที่ 2 อนุญาตการเข้าถึงการอ่านไปยังตารางทรัพยากรบนเว็บ

ทำตามขั้นตอนที่ระบุไว้ใน อนุญาตให้เข้าถึงการอ่านตารางทรัพยากรบนเว็บ

ขั้นตอนถัดไป

ภาพรวม: ใช้ส่วนประกอบของโค้ดในพอร์ทัล

(ดูเพิ่มเติม )

แท็กเอนทิตี Codecomponent Dataverse
แท็กแม่แบบ Codecomponen
ภาพรวมของ Power Apps component framework
สร้างส่วนประกอบแรกของคุณ
เพิ่มส่วนประกอบโค้ดลงในคอลัมน์หรือตารางในแอปแบบจำลอง
ใช้งานส่วนประกอบ API เว็บกับพอร์ทัลตัวอย่าง