Misturando Angular e ASP.NET MVC / Web api?

40

Eu venho usando o ASP.NET MVC / Web API e agora estou começando a usar o Angular, mas não estou claro sobre a maneira correta de misturá-los.

Depois de usar o Angular, os conceitos do lado do servidor MVC ainda fornecem algum valor? Ou eu deveria estar usando estritamente API Web para obter dados para as chamadas HTTP angulares?

Existe talvez um ponto inicial mais simplificado que eu deveria usar se o modelo VS estivesse adicionando muitas coisas que eu não preciso?

Eu gosto da ideia de uma divisão rígida do lado do servidor = dados puros e lado do cliente = processamento puro de HTML.

    
por punkouter2018 28.08.2013 / 16:22
fonte

2 respostas

17

A maneira mais fácil de pensar sobre isso é que o servidor serve um estado. Angular pode gerenciar a coleta de atualizações para esse estado e enviá-lo para uma web / api no servidor. Se você deseja usar um aplicativo de página única, o código do lado do servidor seria apenas o estado inicial do seu aplicativo.

A Web API é um excelente local para começar a extrair seus dados para o seu aplicativo. Você atualizará as rotas padrão para atender aos requisitos de design de seus ambientes e, se desejar, ficará estritamente descansado.

Existem algumas bibliotecas que o ASP4 incluiu por padrão e estas também foram incluídas nos modelos MVC4. Existem realmente muitas coisas incluídas na página que não são necessárias, bem como incluídas no projeto e nunca referenciadas por suas páginas padrão. Você deve estar seguro de remover tudo, exceto o jQuery, e eu vou até o jQueryUI. Muitos dos padrões significam bem, mas uma vez que você começa a preencher seu conhecimento de domínio, você usará libs que atendam às suas necessidades específicas.

Mesmo com uma divisão estrita, você verá que o mvc do lado do servidor ainda é um backup muito limpo para um aplicativo de página única. Roteamento eficaz na entrega de sua página e suas chamadas de API é um excelente exemplo. Outro recurso útil são os controladores que retornam exibições que não usam a página mestra ou são apenas uma exibição parcial. O Angular tem uma "visualização" que pode ser preenchida com um modelo, que pode ser um arquivo estático ou parcial de uma das suas rotas.

Eu li o seu comentário hoje cedo e joguei uma solução de demonstração para mostrar o que eu mencionei originalmente. A solução também tem alguns dos "fluff" originais removidos quando adicionando Angular e Bootstrap você obtém as bibliotecas principais e todas as derivações com elas. Essa é a desvantagem de usar o nuGet.

Confira: link

No aprendizado Angular, achei o programa Angular-Seed bastante útil. Especialmente depois que eu tentei as demos em seu site. O projeto de amostra é apenas diferente o suficiente para ajudá-lo a aprender. Depois disso, eu olhei para o Angular-Require-Seed, mas esse é outro post. Angular passo a passo link Semente Angular: link

    
por 28.08.2013 / 16:47
fonte
18

Is there maybe a more stripped down starting point I should use if the VS template is adding a lot of stuff I don't need?

Esses modelos VS são bons para reduzir a configuração inicial e a curva de aprendizado no início, no entanto, você precisaria personalizá-los para suas necessidades reais de projeto.

Por exemplo, neste site link , meu amigo usa AngularJS junto com ASP.NET MVC . Tenha em mente que este site já foi construído usando ASP.MVC + Jquery para interação na página, conforme necessário.

Por outro lado, ainda existe alguma natureza "Ajaxy" no site, como comentários, votação, sinalização, etc. Não é muito diferente do próprio Stackoverflow. Antes do AngularJS, era uma confusão de plugins e funções do Jquery dentro de $(document).ready() callback, sem mencionar que o código JS não era muito testável.

No geral, ter um mix adequado de ambos torna seu site elegante e funcional.

Algumasboasreferênciasparaprocurar:

por 28.08.2013 / 16:46
fonte