Tag modello Liquid per componenti di codice

Power Apps component framework consente agli sviluppatori professionisti e ai produttori di app di creare componenti di codice per app basate su modello e canvas. Questi componenti di codice possono fornire un'esperienza migliorata per gli utenti che lavorano con i dati su moduli, visualizzazioni e dashboard. Altre informazioni: utilizzare componenti di codice nei portali

Con questa versione, abbiamo introdotto la possibilità di aggiungere componenti di codice usando un Tag modello Liquid nelle pagine Web e nei componenti abilitati tramite l'API Web per i componenti a livello di campo sui moduli nei portali.

I componenti del codice possono essere aggiunti utilizzando il tag modello Liquid codecomponent. La chiave per denotare il componente di codice che deve essere caricato viene passata usando l'attributo name. La chiave può essere il GUID (che è l'ID del componente di codice) o il nome del componente di codice importato in Microsoft Dataverse.

I valori delle proprietà che il componente di codice si aspetta devono essere passati come coppia chiave/valore separati da ":" (due punti), dove la chiave è il nome della proprietà e il valore è il valore della stringa JSON.

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

Ad esempio, per aggiungere un componente di codice che prevede un parametro di input denominato controlValue, usa il seguente tag modello Liquid:

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

Puoi usare il Controllo mappa di esempio e impacchettare il componente di codice come soluzione da utilizzare con i portali.

Esercitazione: utilizzare i componenti del codice nelle pagine con il tag modello Liquid

In questo tutorial, configurerai i portali Power Apps per aggiungere il componente a una pagina web. E poi, visiterai la pagina web dei portali e interagirai con il componente.

Operazioni preliminari

Se stai usando il componente del codice di esempio usato in questa esercitazione, assicurati di importare le soluzioni di esempio nell'ambiente prima di iniziare. Per informazioni sull'importazione della soluzione, vedi Importare soluzioni.

Prerequisiti

Per i prerequisiti e per conoscere i componenti di codice supportati/non supportati nei portali, vedi Utilizzare i componenti del codice nei portali.

Passaggio 1: Aggiungi il componente di codice a una pagina web da Studio

1. Apri il tuo portale in  Studio dei portali Power Apps.

2. Seleziona  Nuova pagina nell'angolo in alto a sinistra.

3. Seleziona  Vuota.

4. Nel riquadro delle proprietà a destra, aggiorna il nome della pagina Web. Ad esempio, "Visualizzatore mappe".

5. Aggiorna l'URL parziale. Ad esempio, "mapviewer".

6. Espandi Autorizzazioni.

7. Disabilita Pagina disponibile per tutti.

8. Seleziona i ruoli web a cui deve essere consentito l'accesso a questa pagina.

9. Seleziona l'area modificabile sulla pagina per modificare il codice sorgente di Liquid.

10. Apri l'editor di codice di studio.

11. Aggiungi il controllo con il tag modello Liquid utilizzando la seguente sintassi:

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

    Suggerimento

    Per recuperare i dettagli di tutti i componenti importati e per cercare il nome di un componente, fai riferimento a CustomControl API Web.

    Ad esempio:

    • Per cercare un componente:

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

    • Per recuperare i parametri di input per un componente:

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

12. Salva e chiudi l'editor di codice.

13. Nell'angolo in alto a destra, seleziona  Esplora sito Web.

14. La pagina web ora mostra il controllo aggiunto.

Passaggi successivi

Panoramica: utilizzare i componenti del codice nei portali

Vedi anche

Tag di entità Dataverse Codecomponent
Tag modello Codecomponent
Panoramica di Power Apps component framework
Crea il tuo primo componente
Aggiungere componenti di codice a una colonna o una tabella nelle app basate su modello
Implementare un componente API Web dei portali di esempio