2012-12-05 19 views
11

come utente di un framework Web lato server (io uso Django), mi piace il modo in cui i modelli sono organizzati. Titolo della pagina, css, js, intestazione e piè di pagina del modello base sono definiti come blocchi e possono essere sostituiti nei modelli figlio.templating in angular.js - ereditarietà

Qual è il modo angolare di farlo?

Il contenuto di ogni pagina è ovviamente fornito da ng-view, a parte questo, non posso fare molto. Il tag title, ad esempio, è esterno alla vista e non posso cambiarlo in modo dinamico.

Sarebbe bene darmi un codice di esempio di un progetto su vasta scala per vedere come sono organizzati i modelli. La maggior parte dei progetti di esempio là fuori sono piccoli e non hanno bisogno di ereditarietà nei modelli.

risposta

6

Le tempistiche di Django sono davvero belle, ma ricordate che Angular è principalmente destinato alla realizzazione di SPA (applicazioni a pagina singola), quindi è concettualmente diverso. In un tipico progetto angolare, il tuo framework lato server genera il modello di base, quindi il routing viene distribuito ad Angular per tutto il resto e le sezioni di contenuto sono incluse condizionalmente in base ai percorsi.

L'unico elemento di somiglianza tra i modelli di Django e Angular è la direttiva ng-include, che consente di eseguire il pop-up di bit di html riutilizzabili. Ma non c'è nulla di simile al sistema {{block}} o {{block super}} di Django.

È possibile scrivere una direttiva personalizzata per introdurre css/javascript aggiuntivi anziché utilizzare {{block extrahead}}.

Per i tag del titolo dinamici, è necessario assicurarsi che l'elemento del controller sia impostato sopra l'elemento head, altrimenti sarà fuori portata e quindi irraggiungibile. Lo facciamo in questo modo nel modello di base:

<title data-ng-bind="title">Oursite</title> 

E poi nel controller per questo URL:

$rootScope.title = 'Dashboard | Oursite'; 

Altri approcci suggeriti in this thread.

4

Dai uno sguardo allo angular-blocks che si ispira a Jade, Handlebars e Django o il più semplice ng-layout.

+0

Ho provato a utilizzare i blocchi angolari, ho faticato per un'ora ma non funziona, puoi aiutarmi per favore? –