Windows mallar för Azure Pack Management Portal Client-Side-tillägg

 

Gäller för: Windows Azure Pack

Hello World Exempel Visual Studio Project sökvägar: Microsoft.WAP.Samples.HelloWorld.TenantExtension\Templates och Microsoft.WAP.Samples.HelloWorld.AdminExtension\Templates

HTML som krävs av tillägget ska placeras i mallar och definieras i manifestet. Mallen läses in i webbläsaren när Windows Azure Pack for Windows Server-hanteringsportalen läses in.

HTML i ett tillägg bearbetas av mallmotorn jsRender (se http://borismoore.github.com/jsviews/demos/index.html och relevanta blogginlägg på http://www.borismoore.com/ ). Om du inte använder någon av malltaggarna ({{ och }} ) matas HTML-koden i mallen ut som den är.

Mallar återges i innehållande element (vanligtvis en div). Se till att ha HTML-kodfragment som är giltiga i ett innehållande element. Bearbetningen av mallar sker inom ramen för ett dataobjekt som används när du söker efter värden som ska ersättas med mallen. Följande är ett exempel på mallmarkering i ett div-element:

<div class="aux-readonlyvalue">
  {{if domain.hasExpiry == true}}
    <span>Expiration data</span>
    <div>{{>domain.ExpiryDate}}</div>
  {{/if}}
</div>

Renderingsmallar

Mallar i ett tillägg refereras till av namnattributet i mallmanifestet. Kontextobjektet kan vara explicit eller implicit. Om du till exempel definierar flikarna för ett tillägg måste du konfigurera en matris med tabbdefinitioner, till exempel i följande:

navigation = {
  tabs: [
    {
      id: "domains",
      displayName: "domains",
      template: "domainsTab",
      activated: loadDomainsTab
    }
  ]
}

Observera parametern "template", som matchar ett namnattributvärde i mallmanifestet. Kontextobjektet anges implicit av ramverket på klientsidan som ett tomt objekt om det är en flik på den översta nivån, dvs. det inte är detaljgranskat till ett objekt, eller så är det objektet som tidigare valts om det är en flik för ökad detaljnivå.

Vissa funktioner kan använda ett explicit kontextobjekt att rendera med. Om du till exempel vill skapa en enkel 1-stegsguide:

cdm.stepWizard({
    extension: "DomainTenantExtension",
    steps: [{
      template: "createStep1",
      data: data,
      onStepCreated: function () {
        wizard = this;
      },
      onStepActivate: step1Activate,
      onNextStep: function () {
        return Shell.UI.Validation.validateContainer("#dm-create-step1");
      }
    }]
  },
  { size: "mediumplus" });

Dataparametern används som kontextobjekt för mallen "createStep1". Detta resulterar i att jsRender tittar på egenskaperna för dataobjektet vid matchning av variabler.

Se även

Windows tillägg för användargränssnitt i Azure Pack Management Portal