Thẻ mẫu Liquid cho thành phần mã

Lưu ý

Từ ngày 12 tháng 10 năm 2022, cổng thông tin Power Apps sẽ trở thành Power Pages. Thông tin khác: Microsoft Power Pages hiện đã được phát hành rộng rãi (blog)
Chúng tôi sẽ sớm di chuyển và hợp nhất hướng dẫn sử dụng cổng thông tin Power Apps với hướng dẫn sử dụng Power Pages.

Power Apps component framework trao quyền cho các nhà phát triển chuyên nghiệp và nhà sản xuất ứng dụng để tạo các thành phần mã cho các ứng dụng canvas và ứng dụng dựa trên mô hình. Các thành phần mã này có thể cung cấp trải nghiệm nâng cao cho người dùng làm việc với dữ liệu trên các biểu mẫu, dạng xem và bảng thông tin. Thông tin thêm: Sử dụng các thành phần mã trong cổng thông tin

Quan trọng

Thẻ mẫu Liquid cho các thành phần mã yêu cầu phiên bản cổng thông tin 9.3.10.x trở lên.

Với bản phát hành này, chúng tôi đã giới thiệu khả năng thêm các thành phần mã được tạo bằng thẻ mẫu Liquid trên các trang web và các thành phần đã bật sử dụng API web được kích hoạt cho các thành phần cấp trường trên biểu mẫu trong cổng thông tin.

Có thể thêm các thành phần mã bằng thẻ mẫu Liquid codecomponent. Khóa để biểu thị thành phần mã cần tải được chuyển bằng thuộc tính name. Khóa có thể là GUID (là ID thành phần mã) hoặc tên của thành phần mã được nhập vào Microsoft Dataverse.

Giá trị của các thuộc tính mà thành phần mã mong đợi cần được chuyển dưới dạng một cặp khóa/giá trị được phân tách bằng ":" (dấu hai chấm), trong đó khóa là tên thuộc tính và giá trị là giá trị chuỗi JSON.

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

Ví dụ: để thêm một thành phần mã yêu cầu tham số đầu vào có tên controlValue, hãy sử dụng thẻ mẫu Liquid sau:

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

Mẹo

Ví dụ này sử dụng các tham số được gọi là controlvalue và controlApiKey, tuy nhiên thành phần mà bạn sử dụng có thể yêu cầu các tên tham số khác nhau.

Bạn có thể sử dụng điều khiển bản đồ mẫu và đóng gói thành phần mã dưới dạng giải pháp để sử dụng với các cổng thông tin.

Lưu ý

Microsoft không hỗ trợ các tài nguyên do cộng đồng tạo. Nếu bạn có thắc mắc hoặc vấn đề với tài nguyên cộng đồng, hãy liên hệ với nhà xuất bản tài nguyên. Trước khi sử dụng các tài nguyên này, bạn phải đảm bảo rằng các tài nguyên này đáp ứng nguyên tắc của Power Apps component framework và chỉ nên dùng cho mục đích tham khảo.

Hướng dẫn: Sử dụng các thành phần mã trên các trang có thẻ mẫu Liquid

Trong hướng dẫn này, bạn sẽ đặt cấu hình các cổng thông tin Power Apps để thêm thành phần vào trang web. Sau đó, bạn sẽ truy cập trang web cổng thông tin và tương tác với thành phần.

Trước khi bạn bắt đầu

Nếu bạn đang sử dụng thành phần mã mẫu được dùng trong hướng dẫn này, hãy đảm bảo rằng trước tiên bạn nhập các giải pháp mẫu vào môi trường trước khi bắt đầu. Để tìm hiểu về cách nhập giải pháp, hãy chuyển đến phần Nhập giải pháp.

Điều kiện tiên quyết

Để biết các điều kiện tiên quyết và để tìm hiểu về các thành phần mã được hỗ trợ/không được hỗ trợ trong cổng thông tin, hãy chuyển đến phần Sử dụng các thành phần mã trong cổng thông tin.

Lưu ý

Hướng dẫn này sử dụng một thành phần mã mẫu được tạo bằng Power Apps component framework để thể hiện tùy chọn điều khiển bản đồ trên một trang web. Bạn cũng có thể sử dụng bất kỳ thành phần hiện có hoặc mới nào của riêng mình và bất kỳ trang web nào khác cho hướng dẫn này. Trong trường hợp này, hãy đảm bảo sử dụng thành phần và trang web của bạn khi làm theo các bước trong hướng dẫn này. Để biết thêm thông tin về cách tạo các thành phần mã, hãy chuyển đến phần Tạo thành phần đầu tiên của bạn.

Bước 1. Thêm thành phần mã vào trang web từ Studio

1. Mở cổng thông tin của bạn trong Power Apps portals Studio.

2. Ở góc trên cùng bên trái, hãy chọn Trang mới.

3. Chọn Trống.

4. Trên ngăn thuộc tính bên phải, hãy cập nhật tên trang web. Ví dụ: "Trình xem bản đồ".

5. Cập nhật URL một phần. Ví dụ: "mapviewer".

6. Mở rộng mục Quyền.

7. Tắt Trang hiển thị với tất cả mọi người.

8. Chọn các vai trò trên web sẽ được phép truy cập vào trang này.

9. Chọn khu vực có thể chỉnh sửa trên trang để chỉnh sửa mã nguồn Liquid.

10. Mở trình chỉnh sửa mã studio.

11. Thêm tùy chọn điều khiển bằng thẻ mẫu Liquid theo cú pháp sau:

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

    Mẹo

    Để truy xuất thông tin chi tiết của tất cả các thành phần đã nhập và tìm kiếm tên thành phần, hãy tham khảo API web CustomControl.

    Ví dụ:

    • Cách tìm kiếm một thành phần:

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

    • Cách truy xuất các tham số đầu vào cho một thành phần:

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

12. Lưu và đóng trình chỉnh sửa mã.

13. Ở góc trên cùng bên phải, hãy chọn Duyệt qua trang web.

14. Trang web bây giờ sẽ hiển thị tùy chọn điều khiển được thêm vào đó.

Các bước tiếp theo

Tổng quan: Sử dụng các thành phần mã trong cổng thông tin

Xem thêm

Thẻ thực thể Codecomponent Dataverse
Thẻ mẫu Codecomponent
Tổng quan về Power Apps component framework
Tạo thành phần đầu tiên của bạn
Thêm một thành phần mã vào một cột hoặc bảng trong ứng dụng dựa trên mô hình
Triển khai thành phần API Web cổng thông tin mẫu

Lưu ý

Bạn có thể cho chúng tôi biết bạn thích dùng ngôn ngữ nào cho tài liệu không? Làm một cuộc khảo sát ngắn. (xin lưu ý, khảo sát này bằng tiếng Anh)

Cuộc khảo sát sẽ mất khoảng bảy phút. Không có dữ liệu cá nhân nào được thu thập (điều khoản về quyền riêng tư).