Angular Providers sind wiederverwendbare Komponenten, die in mehrere Widgets eingefügt werden können. Um ein schnelles Laden von Widgets und ein leistungsfähiges Portal sicherzustellen, erstellen Sie Angular Providers, anstatt Ihre Client-Controller mit permanenten Daten und zusätzlicher Logik zu überladen. Mit Angular Providers können Sie Daten für die gesamte Lebensdauer Ihres Serviceportal verwalten und Komponenten und Datenobjekten in mehreren Widgets wiederverwenden.

Vorbereitungen

Erforderliche Rolle: admin oder sp_admin

Warum und wann dieser Vorgang ausgeführt wird

Durch das Erstellen eines Angular Providers können Sie:

  • Aufrechterhalten der Synchronisierung von Widgets, beim Ändern von Datensätzen bzw. Filtern.
  • Teilen von Kontext zwischen Widgets.
  • Beibehalten und Fortbestehen lassen des Status.
  • Erstellen Sie Verhalten und fügen Sie sie in mehrere Widgets ein.

Um mehr zu erfahren, besuchen Sie Angular Providers.

Tipp: Entfernen Sie zur einfacheren Wartung und Fehlerbehebung alle nicht verwendeten Provider aus der zugehörigen Liste Angular Providers in der Widget-Tabelle [sp_widget].

Prozedur

  1. Navigieren zu Alle > Service Portal > Service Portal-Konfiguration > Portal-Tabellen > Widget Angular Provider.
    Die Tabelle Widget Angular Providers wird geöffnet.
  2. Klicken Sie auf Neu, um einen neuen Datensatz zu erstellen.
  3. Wählen Sie den Typ des Angular Providers.
    • Richtlinie
    • Werk
    • Service
    Um die Migration zu ECMAScript 6 oder höher zu erleichtern, sollten Sie Services anstelle von Produktionsstandorten verwenden.
  4. Einen Namen definieren
    Sie verwenden den Namen, um den Provider Ihrem Widget zuzuordnen.
  5. Fügen Sie ein Skript im Feld Clientskript hinzu.

    Eine Basisanlage, die eine Zahl in US-Währung formatiert.

    function formatterFactory(){
  var myVal = Number;
  return {
    format: function(myVal) {
      return '$' + myVal.toFixed(2);
    }
  }
}
  6. Ordnen Sie den Angular Provider einem Widget zu.
    1. Navigieren Sie zu <yourInstanceURL>/sp_config?id=widget_edit.
    2. Öffnen Sie das Widget, das Sie mit dem Angular Provider verknüpfen möchten.
    3. Unter Verwandte Listen, wählen Sie Angular Providers.
    4. In der Liste Angular Providers klicken Sie auf Neu.
    5. Im Feld Angular Provider wählen Sie den entsprechenden Provider aus.
    6. Überprüfen Sie das Feld Widget, um sicherzustellen, dass Sie den Angular Provider mit dem richtigen Widget verknüpfen
    7. Klicken Sie auf Speichern.
  7. Aktualisieren Sie die entsprechenden Skripts in Ihrem Widget, um den Angular Provider in das Widget einzufügen.

    Fügen Sie die Anlage in Ihr Widget-Clientskript ein, indem Sie den Namen der Anlage als Argument in Ihrer Client-Controller-Funktion übergeben. Sie können dann auf das in der Anlage-Funktion definierte Objekt in Ihrem Widget-Clientskript zugreifen.

    function(formatterFactory) {
  /* widget controller */
  var c = this;
  console.log(formatterFactory.format(300));
}

    Wenn Sie eine Direktive definieren, verwenden Sie die Direktive in der Widget-HTML-Vorlage.

  8. Um den Angular Provider zu bearbeiten, nachdem er mit Ihrem Widget registriert wurde, öffnen Sie das Angular Provider-Clientskript im Widget-Editor.
    1. Navigieren zu Serviceportal-Konfiguration > Widget-Editor.
    2. Unter Bearbeiten eines vorhandenen Widgets, wählen Sie das Widget aus, das Ihrem Angular Provider zugeordnet ist.
    3. Öffnen Sie im Menü Anzeigen die Liste der Abhängigkeiten, und wählen Sie den Angular Provider aus.
      Hinweis: Nur Angular Providers, die dem Widget zugeordnet sind, werden in der Liste Abhängigkeiten angezeigt. Diese Liste enthält alle externen Ressourcen, von denen Ihr Widget abhängig ist.
      Das Angular Provider-Clientskript wird im Widget-Editor angezeigt. In der Widget-Editor-Oberfläche können Sie Ihr Widget und Ihre Provider-Skripts gleichzeitig bearbeiten und speichern.

Nächste Maßnahme

Um einen Angular Provider mit mehreren Widgets zu verwenden, registrieren Sie Ihren Provider mit jedem Widget und aktualisieren Sie die entsprechenden Skripts.