Etiqueta de modelo líquido para compoñentes de código

[Este artigo é a documentación de prelanzamento e está suxeito a cambios.]

Power Apps component framework permite aos programadores profesionais e aos creadores de aplicacións crear compoñentes de código para aplicacións baseadas en modelos e lenzos. Estes compoñentes de código poden proporcionar unha experiencia mellorada aos usuarios que traballan con datos en formularios, vistas e paneis. Máis información: Usa os compoñentes de código nos portais

Importante

A etiqueta de modelo Liquid para compoñentes de código require a versión de portais 9.3.10.x ou posterior.

Con esta versión, introducimos a posibilidade de engadir compoñentes de código usando a Etiqueta de modelo líquido en páxinas web e compoñentes habilitados mediante a API web que están habilitados para compoñentes a nivel de campo en formularios en portais.

Os compoñentes do código pódense engadir usando ocodecomponent Etiqueta de modelo líquido. A clave para indicar o compoñente de código que se debe cargar pásase usando o atributo name. A clave pode ser o GUID (que é o ID do compoñente de código) ou o nome do compoñente de código importado en Microsoft Dataverse.

Os valores das propiedades que espera o compoñente de código deben pasarse como un par clave/valor separados por ": " (signo de dous puntos), onde a clave é o nome da propiedade e o valor é o valor da cadea JSON.

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

Por exemplo, para engadir un compoñente de código esperando un parámetro de entrada chamado controlValue, use a seguinte etiqueta de modelo líquido:

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

Suxestión

Este exemplo usa parámetros chamados valor de control e controlApiKey, non obstante, o compoñente que utiliza pode requirir nomes de parámetros diferentes.

Podes usar o control de mapas de mostra e empaqueta o compoñente do código como solución para usar con portais.

Nota

Os recursos creados pola comunidade non son compatibles con Microsoft. Se ten dúbidas ou problemas cos recursos da comunidade, póñase en contacto co editor do recurso. Antes de utilizar estes recursos, debes asegurarte de que cumpren os requisitos Power Apps directrices do marco de compoñentes e só se deben utilizar como referencia.

Titorial: Usar compoñentes de código en páxinas coa etiqueta de modelo Liquid

Neste tutorial, configurarás Power Apps portais para engadir o compoñente a unha páxina web. A continuación, visitará a páxina web dos portais e interactuará co compoñente.

Antes de comezar

Se estás a usar o compoñente de código de mostra usado neste titorial, asegúrate de importar primeiro as solucións de mostra ao ambiente antes de comezar. Para obter información sobre a importación de solucións, vai a Importar solucións.

Requisitos previos

Para coñecer os requisitos previos e para obter información sobre os compoñentes de código admitidos/non compatibles nos portais, vai a Usa os compoñentes de código nos portais.

Nota

Este tutorial usa un compoñente de código de mostra creado usando Power Apps marco de compoñentes para demostrar un control de mapa nunha páxina web. Tamén podes usar calquera compoñente existente ou novo, e calquera outra páxina web para este titorial. Neste caso, asegúrate de usar o teu compoñente e a túa páxina web ao seguir os pasos deste tutorial. Para obter máis información sobre como crear compoñentes de código, vaia a Crea o teu primeiro compoñente.

Paso 1. Engade o compoñente de código a unha páxina web de Studio

1. Abra o seu portal en Studio de portais de Power Apps.

2. Na esquina superior esquerda, seleccione Nova páxina.

3. Seleccione En branco.

4. No panel de propiedades do lado dereito, actualice o nome da páxina web. Por exemplo, "Visor de mapas".

5. Actualice o URL parcial. Por exemplo, "visor de mapas".

6. Expandir permisos.

7. Desactive Páxina dispoñible para todo o mundo.

8. Seleccione os roles web aos que se lles debería permitir acceder a esta páxina.

9. Seleccione a área editable da páxina para editar o código fonte de Liquid.

10. Abra o editor de código de Studio.

11. Engade control coa etiqueta de modelo Liquid usando a seguinte sintaxe:

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

    Suxestión

    Para recuperar os detalles de todos os compoñentes importados e buscar un nome de compoñente, consulte a API web CustomControl.

    Por exemplo:

    • Para buscar un compoñente:

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

    • Para recuperar os parámetros de entrada dun compoñente:

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

12. Garde e peche o editor de código.

13. Na esquina superior dereita, seleccione Explorar sitio web.

14. A páxina web agora mostrará o control engadido a ela.

Pasos seguintes

Visión xeral: usar os compoñentes de código nos portais

Consulte tamén

Compoñente de código Dataverse etiqueta de entidade
Etiqueta de modelo de compoñente de código
Visión xeral de Power Apps component framework
Crear o seu primeiro compoñente
Engade compoñentes de código a unha columna ou táboa en aplicacións baseadas en modelos
Implementar un compoñente de API web dun portal de exemplo

Nota

Pode indicarnos as súas preferencias para o idioma da documentación? Realice unha enquisa breve. (teña en conta que esa enquisa está en inglés)

Esta enquisa durará sete minutos aproximadamente. Non se recompilarán datos persoais (declaración de privacidade).