Tudo depende do que você deseja do seu fragmento de código. Pessoalmente, se o código não tiver nenhuma lógica, ou nem precisar de um controlador, eu continuo ngInclude. Normalmente coloco fragmentos html maiores e mais "estáticos" que não quero atrapalhar a visualização aqui. (isto é: digamos que uma grande tabela cujos dados vêm do controlador pai de qualquer maneira. É mais limpo do <div ng-include="bigtable.html" />que todas as linhas que obstruem a visualização)
Se houver lógica, manipulação de DOM ou se você precisar que seja personalizável (também conhecido como renderizar de forma diferente) em diferentes instâncias em que for usado, então directivessão a melhor escolha (são assustadores no início, mas são muito poderosos, dê um tempo) .
ngInclude
Às vezes você verá ngInclude'sque são afetados por seu $scope/ exterior interface. Como um repetidor grande / complicado, digamos. Essas 2 interfaces estão interligadas por causa disso. Se algo nas principais $scopemudanças, você deve alterar / alterar sua lógica dentro do seu parcial incluído.
Diretivas
Por outro lado, as diretivas podem ter escopos / controladores / etc. explícitos. Portanto, se você estiver pensando em um cenário em que terá que reutilizar algo várias vezes, poderá ver como ter seu próprio escopo conectado tornaria a vida mais fácil e menos confuso.
Além disso, a qualquer momento que você for interagir com o DOM, você deve usar uma diretiva. Isso o torna melhor para teste e desacopla essas ações de um controlador / serviço / etc, que é algo que você deseja!
Dica: certifique-se de não usar restrito: 'E' se você se preocupa com o IE8! Existem maneiras de contornar isso, mas são irritantes. Basta tornar a vida mais fácil e ficar com o atributo / etc.<div my-directive />
Componentes [atualização 01/03/2016]
Adicionado no Angular 1.5, é essencialmente um invólucro .directve(). O componente deve ser usado na maioria das vezes. Ele remove muito código de diretiva clichê, por padrão para coisas como restrict: 'E', scope : {}, bindToController: true. Eu recomendo fortemente o uso deles para quase tudo em seu aplicativo, a fim de poder fazer a transição para o Angular2 mais facilmente.
Em conclusão:
Você deve criar Componentes e Diretivas na maior parte do tempo.
- Mais extensível
- Você pode modelar e ter seu arquivo externamente (como ngInclude)
- Você pode escolher usar o escopo pai ou seu próprio escopo isolado dentro da diretiva.
- Melhor reutilização em todo o seu aplicativo
Atualização 01/03/2016
Agora que o Angular 2 está sendo concluído aos poucos, e sabemos o formato geral (é claro que ainda haverá algumas mudanças aqui e ali), só queria adicionar o quão importante é fazer components(às vezes, diretivas se você precisar que sejam restritas: ' E 'por exemplo).
Os componentes são muito semelhantes aos do Angular 2 @Component. Desta forma, estamos encapsulando o logic & html na mesma área.
Certifique-se de encapsular o máximo de coisas que puder em componentes, isso tornará a transição para o Angular 2 muito mais fácil! (Se você escolher fazer a transição)
Aqui está um bom artigo que descreve esse processo de migração usando directives(muito semelhante se você fosse usar componentes, é claro): http://angular-tips.com/blog/2015/09/migrating-directives-to-angular-2/