Dela via

Liquid-malltagg för kodkomponenter

  • Artikel

Anteckning

Från och med den 12 oktober 2022 byter Power Apps-portaler namn till Power Pages. Mer information: Microsoft Power Pages är nu allmänt tillgänglig (blogg)
Vi kommer snart migrera och sammanfoga dokumentationen för Power Apps-portaler med Power Pages-dokumentationen.

Power Apps component framework gör det möjligt för professionella utvecklare och apputvecklare att skapa kodkomponenter för modellbaserade appar och arbetsyteappar. De här kodkomponenterna kan ge en bättre upplevelse för användare som arbetar med data i formulär, vyer och instrumentpaneler. Mer information: Använd komponenter i portaler

Viktigt

Liquid-malltaggen för kodkomponenter kräver portalversion 9.3.10.x eller senare.

I och med denna version introducerar vi möjligheten att lägga till kodkomponenter med en Liquid-malltagg på webbsidor, och vi har också möjliggjort komponenter med webb-API som aktiveras för komponenter på fältnivå i formulär på portaler.

Kodkomponenter kan läggas till med hjälp av codecomponent-Liquid-malltaggen. Nyckeln till att ange den kodkomponent som behöver läsas in skickas in med hjälp av attributet name. Nyckeln kan vara GUID (som är kodkomponentens ID) eller namnet på kodkomponenten som importeras i Microsoft Dataverse.

Värdena för de egenskaper som kodkomponenten förväntar sig måste skickas som ett nyckel-/värdepar som åtskiljs av ":" (kolontecken), där nyckeln är egenskapsnamnet och värdet är JSON-strängvärdet.

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

För att till exempel lägga till en kodkomponent som förväntar sig en indataparameter kallad controlValue använder du följande Liquid-malltagg:

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

Tips

I det här exemplet används parametrar kallade controlvalue och controlApiKey, men den komponent du använder kan komma att kräva andra parameternamn.

Du kan använda exempelkartkontroll och paketera kodkomponenten som en lösning som används med portaler.

Anteckning

Resurser som har skapats av communityn stöds inte av Microsoft. Om du har frågor eller problem med community-resurser kontaktar du utgivaren av resursen. Innan du använder dessa resurser måste du se till att de uppfyller riktlinjerna för Power Apps component framework och bör endast användas som referens.

Självstudier: Använd kodkomponenter på sidor med Liquid-malltagg

I den här självstudien konfigurerar du Power Apps-portaler för att lägga till komponenten på en webbsida. Därefter besöker du portalens webbsida och interagerar med komponenten.

Innan du börjar

Om du använder exempelkodskomponenten som används i den här självstudien ska du se till att du först importerar exempellösningarna i miljön innan du börjar. Mer information om lösningsimport finns i Importera lösningar.

Förutsättningar

För förutsättningar, samt för att lära dig vilka kodkomponenter som stöds/ej stöds i portaler, gå till Använda kodkomponenter i portaler.

Anteckning

I den här självstudien används en exempelkodkomponent som skapats med hjälp av Power Apps component framework för att demonstrera en kartkontroll på en webbsida. Du kan också använda en egen befintlig eller ny komponent samt en annan webbsida för den här självstudien. I det här fallet bör du se till att du använder komponenten och webbsidan när du följer stegen i den här självstudien. Mer information om hur du skapar kodkomponenter finns i Skapa din första komponent.

Steg 1. Lägga till kodkomponenten på en webbsida från Studio

  1. Öppna portalen i  Power Apps portalstudion.

  2. I det övre vänstra hörnet väljer du Ny sida.

  3. Välj Tom.

  4. Uppdatera webbsidans namn i egenskapsfönstret till höger. Till exempel "Kartvisare".

  5. Uppdatera delvisa URL-adresser. Till exempel "kartvisare".

  6. Expandera Behörigheter.

  7. Inaktivera Sida tillgänglig för alla.

  8. Välj vilka webbroller som ska ha åtkomst till den här sidan.

  9. Välj det redigerbara området på sidan om du vill redigera Liquid-källkoden.

  10. Öppna kodredigeraren för Studio.

  11. Lägg till kontroll med Liquid-malltagg med hjälp av följande syntax:

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

    Tips

    Om du vill ha information om alla importerade komponenter eller söka efter ett komponentnamn, se webb-API för CustomControl.

    Till exempel:

    • För att söka efter en komponent:

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

    • Så här hämtar du indataparametrar för en komponent:

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

  12. Spara och stäng kodredigeraren.

  13. I det övre högra hörnet väljer du Bläddra webbplats.

  14. På webbsidan visas nu den kontroll som lagts till.

Nästa steg

Översikt: Använd kodkomponenter i portaler

Se även

Kodkomponent Dataverse-entitetstagg
Kodkomponent Mall-tagg
Översikt över Power Apps component framework
Skapa din första komponent
Lägga till kodkomponenter i en kolumn eller tabell i modellbaserade appar
Implementera en webb-API-komponent för en exempelportal

Anteckning

Kan du berätta om dina inställningar för dokumentationsspråk? Svara i en kort undersökning. (observera att undersökningen är på engelska)

Undersökningen tar ungefär sju minuter. Inga personuppgifter samlas in (sekretesspolicy).