Windows Szablony rozszerzeń Client-Side portalu administracyjnego pakietu Azure Pack

 

Dotyczy: Windows Azure Pack

Hello world przykładowe ścieżki Visual Studio Project: Microsoft.WAP.Samples.HelloWorld.TenantExtension\Templates i Microsoft.WAP.Samples.HelloWorld.AdminExtension\Templates

Kod HTML wymagany przez rozszerzenie powinien zostać umieszczony w szablonach i zdefiniowany w manifeście. Spowoduje to załadowanie szablonu do przeglądarki po załadowaniu portalu zarządzania Windows Azure Pack for Windows Server.

Kod HTML w rozszerzeniu jest przetwarzany przez aparat tworzenia szablonów jsRender (zobacz http://borismoore.github.com/jsviews/demos/index.html i odpowiednie wpisy w blogu w witrynie http://www.borismoore.com/ ). Jeśli nie używasz żadnego z tagów szablonu ({{ i }}), kod HTML w szablonie jest danymi wyjściowymi.

Szablony są renderowane w ramach elementów zawierających (zwykle div). Pamiętaj, aby mieć fragmenty kodu HTML, które są prawidłowe, znajdują się w element zawierającym element. Przetwarzanie szablonów odbywa się w kontekście obiektu danych, który jest używany podczas wyszukiwania wartości do zastąpienia do szablonu. Poniżej przedstawiono przykład znaczników szablonu w elemecie div:

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

Renderowanie szablonów

Szablony w rozszerzeniu są określane przez atrybut name w manifeście szablonu. Obiekt kontekstu może być jawny lub niejawny. Na przykład zdefiniowanie kart dla rozszerzenia obejmuje skonfigurowanie tablicy definicji tabulacji, takich jak w następujących:

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

Zwróć uwagę na parametr "template", który odpowiada wartości atrybutu nazwy w manifeście szablonu. Obiekt kontekstu zostanie ustawiony niejawnie przez strukturę po stronie klienta jako pusty obiekt, jeśli jest to karta najwyższego poziomu, to znaczy, że nie jest on przechodzeniem do szczegółów elementu lub element zostanie wcześniej wybrany, jeśli jest to karta przechodzenia do szczegółów.

Niektóre funkcje mogą przyjmować jawny obiekt kontekstu do renderowania. Aby na przykład utworzyć prosty kreator 1-krokowy:

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" });

Parametr danych jest używany jako obiekt kontekstu szablonu "createStep1". Powoduje to, że jsRender analizuje właściwości obiektu danych podczas rozpoznawania zmiennych.

Zobacz też

Windows rozszerzenia interfejsu użytkownika portalu administracyjnego pakietu Azure Pack