2014-04-04 16 views
5

Una pagina di destinazione è spesso completamente diversa dall'aspetto e dall'aspetto di altre pagine.AngularJs e pagina di destinazione

Fondamentalmente, con il meccanismo di routing predefinito angolare, index.html potrebbe avere un ng-view per visualizzare le varie pagine.
Non c'è il concetto di "condizioni" con questa vista ng.

In effetti, cosa succede se desidero specificare una barra di navigazione per tutte le pagine tranne la pagina di destinazione?

Devo "includere" una barra di navigazione su ciascuno di questi modelli, interrompendo il principio DRY?

+1

O non utilizzare angolare per pagine di destinazione. Portali nella tua app dopo aver fatto clic sull'invito all'azione o * continua al sito * –

+0

@ ogc-nick Ho pensato a questo, ma perché forzare un aggiornamento se una soluzione Angolare potrebbe esistere. L'esperienza utente potrebbe essere migliorata (niente CSS, JS da recuperare di nuovo ecc.) – Mik378

+0

Nella mia situazione particolare la mia pagina di destinazione non è una pagina statica e vorrei avere accesso a funzioni angolari. –

risposta

1

ho fatto che utilizzando angolare-ui-router https://github.com/angular-ui/ui-router/wiki

Con angolare UI Router È possibile definire gli stati, invece, ma è necessario pub/sub lo stato di nuovo al componente di navigazione.

Il router ui angolare consente di nidificare le viste in modo che non sia necessario spostare la navigazione all'esterno della vista, il che comporterebbe il ricaricamento della pagina fuori dalla propria vista.

Solo una nota ui router sta utilizzando la direttiva ui-sref per navigare al posto di ng-href. Questo potrebbe essere un grande lavoro per riforgiare il tuo progetto Ma credo che ne valga la pena.

Informazioni sulla modifica della navigazione. Puoi avere la tua navigazione avvolta in una direttiva ng-if o ng-show oppure puoi avere un modello base completamente diverso sullo stato /,/home.

Cheers

+0

In realtà, il mio scenario reale è che ho una barra di navigazione diversa (componente di bootstrap) per la mia pagina di destinazione. Così ho giocato con la posizione corrente in una 'ng-class' per mostrare o nascondere le classi previste, riguardo se l'utente è sulla pagina di destinazione o su altri. Tuttavia, in alcune circostanze, quando Angular non è stato ancora caricato, ho qualche ritardo per la visualizzazione della barra di navigazione destra. (usare ng-cloak non sarebbe molto UX) Hope Angular ui-router può aiutare :) – Mik378

+0

Se si dipende molto dal bootstrap date un'occhiata a http://angular-ui.github.io/bootstrap/. Suggerisco una direttiva navbar o una vista, a seconda di quale sia più semplice per te. –

+0

Sì, lo uso per altri componenti come le modali, ad eccezione della barra di navigazione, che non offre un vantaggio eccezionale. Ciò non cambierebbe la scelta della soluzione di questo post dal modo in cui :) => Avrei lo stesso problema – Mik378

Problemi correlati