Tutto dipende da cosa vuoi dal tuo frammento di codice. Personalmente, se il codice non ha alcuna logica o non ha nemmeno bisogno di un controller, allora vado con ngInclude. In genere metto frammenti html più grandi e "statici" che non voglio che ingombrino la vista qui. (cioè: diciamo una grande tabella i cui dati provengono comunque dal controllore genitore. È più pulito da avere<div ng-include="bigtable.html" /> rispetto a tutte quelle linee che ingombrano la vista)
Se c'è logica, manipolazione DOM, o hai bisogno che sia personalizzabile (ovvero renderizza in modo diverso) in diversi casi in cui viene utilizzato, allora directivessono la scelta migliore (sono scoraggianti all'inizio, ma sono molto potenti, dagli tempo) .
ngInclude
A volte vedrai ngInclude'sche sono influenzati dal loro esterno $scope/ interface. Come un ripetitore grande / complicato diciamo. Queste 2 interfacce sono collegate insieme per questo motivo. Se qualcosa nelle principali $scopemodifiche, è necessario modificare / cambiare la logica all'interno del parziale incluso.
Direttive
D'altra parte, le direttive possono avere ambiti / controller / ecc. Espliciti Quindi se stai pensando a uno scenario in cui dovresti riutilizzare qualcosa più volte, puoi vedere come avere il proprio ambito connesso renderebbe la vita più facile e meno confuso.
Inoltre, ogni volta che interagirai con il DOM, dovresti usare una direttiva. Questo lo rende migliore per i test e separa queste azioni da un controller / servizio / ecc., Che è qualcosa che vuoi!
Suggerimento: assicurati di non usare limitare: 'E' se ti interessa IE8! Ci sono modi per aggirare questo problema, ma sono fastidiosi. Rendi la vita più facile e mantieni l'attributo / ecc.<div my-directive />
Componenti [aggiornamento 1/3/2016]
Aggiunto in Angular 1.5, è essenzialmente un wrapper .directve(). Il componente dovrebbe essere utilizzato la maggior parte del tempo. Rimuove un sacco di codice direttiva boilerplate, impostando per impostazione predefinita cose come restrict: 'E', scope : {}, bindToController: true. Consiglio vivamente di utilizzarli per quasi tutto nella tua app, in modo da poter passare più facilmente ad Angular2.
In conclusione:
Dovresti creare componenti e direttive per la maggior parte del tempo.
- Più estensibile
- Puoi modellare e avere il tuo file esternamente (come ngInclude)
- È possibile scegliere di utilizzare l'ambito padre o il proprio ambito isolato all'interno della direttiva.
- Riutilizzo migliore in tutta l'applicazione
Aggiornamento 1/3/2016
Ora che Angular 2 si sta lentamente concludendo e conosciamo il formato generale (ovviamente ci saranno ancora alcuni cambiamenti qua e là) volevo solo aggiungere quanto sia importante fare components(a volte le direttive se hai bisogno che siano restrittive: ' E 'per esempio).
I componenti sono molto simili a quelli di Angular 2 @Component. In questo modo stiamo incapsulando logica e html nella stessa area.
Assicurati di incapsulare quante più cose possibile nei componenti, renderà la transizione ad Angular 2 molto più semplice! (Se scegli di effettuare la transizione)
Ecco un bell'articolo che descrive questo processo di migrazione utilizzando directives(molto simile se si utilizzassero componenti ovviamente): http://angular-tips.com/blog/2015/09/migrating-directives-to-angular-2/