it-swarm.com.de

was ist der Zweck der Verwendung des abstrakten Zustands?

Ich arbeite an meinem Tutorial AngularUI-Projekt. Ich habe alles über Zustände, verschachtelte Zustände und abstrakte Zustände gelesen. Das Problem ist, dass ich nicht verstehen kann, warum und wann ich abstrakten Zustand verwenden soll. 

15
Michael

Abstrakter Zustand bedeutet, dass der Zustand, den Sie geschrieben haben, nicht zugänglich ist direkt. Abstrakte Staaten brauchen immer noch ihre eigenen, damit sich ihre Kinder daran anschließen können. 

Es wird aufgerufen, wenn wir den Zustand seines Kindes laden. Sie können den abstrakten Status verwenden, um ein anfängliches Muster Ihrer Seite zu definieren. Angenommen, Sie können ein Beispiel für eine beliebige Social-Media-Site verwenden, auf der Sie das Benutzerprofil und die soziale Seite anzeigen möchten. Dafür könnten Sie einen abstract-Zustand haben, der url: "" & ein grundlegendes Layout Ihrer Seite haben wird. Wie header benannten content & footer Ansichten. Die header & footer benannte Ansicht wird durch den abstrakten Zustand ausgefüllt. Das untergeordnete Element definiert dann, was der Inhalt ist, abhängig davon, welches Modul angezeigt wird. /profile zeigt den userProfile.html an und /social zeigt die soziale Seite eines Benutzers social.html an.

Config

app.config(function($stateProvider){
  $stateProvider.state("app":
  {
    url: "", //you can have the default url here..that will shown before child state url
    abstract: true,
    views: {
       '': {
          templateUrl: 'layout.html',
          controller: 'mainCtrl'
       },
       'header': {
          templateUrl: 'header.html'
       },
       'footer': {
          templateUrl: 'footer.html'
       }
    },
    resolve: {
       getUserAuthData: function(userService){
           return userService.getUserData();
       }
    }

  })
  .state("app.profile": {
      '[email protected]': {
          templateUrl: 'profile.html',
          controller: 'profileController'
      }
  })
  .state("app.social": {
      '[email protected]': {
          templateUrl: 'social.html',
          controller: 'socialController'
      }
  })
})

Ein weiteres Hauptmerkmal von abstract ist, dass Sie über eine gemeinsame Auflösung verfügen und geerbte benutzerdefinierte Daten über Daten zur Verwendung durch untergeordnete Status oder einen Ereignislistener bereitstellen können. Sie können auch OnEnter & OnExit verwenden, um sicherzustellen, dass vor dem Laden von state & beim Verlassen von state sichergestellt wird.

21
Pankaj Parkar

Wenn Sie keinen Zustand wünschen, in den\übergehen kann, können Sie ihn zu einem abstrakten Zustand machen. Beispiel

\A
\A.B
\A.B.C

Wenn Sie nicht möchten, dass der Benutzer einfach zu \A wechselt, sollten Sie abstract angeben. 

5
AD.Net

Grundsätzlich helfen abstrakte Zustände, allgemeine Funktionen aus verschiedenen Zuständen in einen übergeordneten abstrakten Zustand zu verschieben.

Ein typisches Beispiel ist ein Zustand, der das Laden von Benutzernamen, Lokalisierungseinstellungen und Metadaten übernimmt. Sie möchten nicht, dass der Benutzer zu einem Status umleitet, der genau das lädt. Sie möchten, dass das immer geladen wird, wenn Sie in jeden Status umgeleitet werden

/session wäre abstrakt, aber /session/main, /session/detail nicht. Durch die Abhängigkeiten werden Sitzungsdaten geladen, wenn in den Status main und detail gewechselt wird, der Benutzer soll jedoch nicht in den Status session wechseln.

3
Sulthan

Abstrakte Zustände

Es gibt Situationen, in denen einige gemeinsame Informationen in mehreren Staaten verfügbar sein müssen. Zu diesem Zweck bietet der UI-Router die Möglichkeit, abstrakte Zustände anzugeben. _. Abstrakte Zustände können untergeordnete Zustände haben, sie können jedoch nicht aktiviert werden, auch nicht auf diese umgestellt werden. Ein abstrakter Status wird implizit aktiviert, wenn einer seiner untergeordneten Status aktiviert wird. Dies ist nützlich, wenn: Allen URLs der untergeordneten Status eine URL vorangestellt wird Wir müssen eine Vorlage mit einer eigenen einfügen ui-view, dass die untergeordneten Zustände ausgefüllt werden Wir müssen aufgelöste Abhängigkeiten bereitstellen (über Auflösen), um von untergeordneten Zuständen verwendet zu werden Wir müssen vererbte benutzerdefinierte Zustandsdaten bereitstellen, um von untergeordneten Zuständen oder verwendet zu werden Ereignisse Abstrakte Zustände werden definiert, wobei der abstrakte Schlüssel im Zustandskonfigurationsobjekt auf true festgelegt wird.

$stateProvider

.state('home', {

    abstract: true,

    templateURL: 'home.html'

})
0
Abdulqadir_WDDN