Razor 模板、视图和 angular.js [英] Razor templates, views and angular.js

问题描述

使用 .NET Razor 视图和 AngularJS 的最佳实践是什么?

What are the best practices when using .NET Razor views and AngularJS?

我们正在使用 mvc4 和 razor 开发一个公共网站(不是内部网应用程序)，我们对客户端脚本不是很熟悉，所以我们从我们知道的东西开始:jQuery.但现在事情变得越来越复杂，我们想切换到 AngularJS.

We are developing a public website (not an intranet application) using mvc4 with razor, and we weren't very familiar with client script, so we started with what we knew: jQuery. But now things are getting more complicated and we'd like to switch to AngularJS.

在 .NET 部分，我们使用 Razor 模板和 UIHintAttribute(加上一些自定义的)来呈现正确的 html控件".我们还添加了自定义 html 属性来为 jQuery 部分提供额外的信息(例如 title 用于工具提示....)

On the .NET part, we use Razor templates and UIHintAttribute (plus some custom ones) to render the right html "control". We also add custom html attributes to give extra information to the jQuery part (like title for a tooltip....)

所以我们已经使用了一种声明方式来设置用户界面行为，这就是为什么 AngularJS 看起来是一个不错的选择.

So we already use a declarative way of setting the user interface behavior, that's why AngularJS seems a good option.

既然我们已经在服务端定义了模型，而且AngularJS也使用了模型，那会不会迫使我们重复代码?

Since we already have models defined server side, and since AngularJS also uses models, wouldn't it force us to duplicate code?

我们如何处理数据绑定功能，因为我们已经做了一些绑定服务器端(在视图中).我们应该制作一个完全异步的应用程序，从 AngularJS 调用 AJAX 来加载数据，还是可以混合使用?

How do we deal with data binding feature, since we already do some binding server side (in the views). Should we make a completely asynchronous application, making AJAX calls from AngularJS to load data, or can we mix both?

在尝试使用这两种技术时，我们还应该注意什么?

Anything else we should be aware of when trying to use both of these technologies?

我在 Google 上做了一些研究，但我找不到将 Razor 视图和模板与 AngularJS 混合的详细方法......也许这不是一件好事?

I did some research on Google, but I can't find detailed ways of mixing Razor views and templates with AngularJS... Perhaps that's just not a good thing to do?

推荐答案

在使用 MVC 和另一个 JavaScript 框架 (Knockout) 时，我们处理了这个问题数月.最终，如果您打算使用客户端 MV* 框架来呈现您的用户界面，您会发现大部分放弃 Razor 将是您最好的选择.

We dealt with this issue for months when working with MVC plus another JavaScript framework (Knockout). Ultimately, if you're going to be using a client-side MV* framework for rendering your user interface, you will find that mostly ditching Razor is going to be your best bet.

大多数主要的 MV* JavaScript 框架(包括 AngularJS)都假设您将根据 JavaScript 模型或视图模型维护 UI 状态并呈现您的用户界面.尝试混合使用服务器端渲染不会很好地工作.

Most of the major MV* JavaScript frameworks, including AngularJS, assume you will be maintaining UI state and rendering your user interface based on JavaScript models or view models. Trying to mix in server-side rendering is just not going to work very well.

这并不是说在开发 Angular 应用程序时 MVC 没有用处.您仍然可以利用一些很棒的功能，例如 ASP.NET 捆绑和缩小.有时，使用 Razor 视图或部分视图将 JSON 直接嵌入到页面中非常有效，而不是进行额外的 AJAX 调用.

That's not to say there is no use for MVC when it comes to developing an Angular application. You can still take advantage of some great features like ASP.NET Bundling and Minification. And sometimes it works really well to embed JSON directly into the page using a Razor view or partial as opposed to making an additional AJAX call.

至于模型，您可能需要查看 Breeze.js.它是一个用于数据访问的 JavaScript 库，非常适合与服务器端的 ASP.NET 一起共享模型元数据.

As for models, you may want to take a look at Breeze.js. It's a JavaScript library for data access that goes great with ASP.NET on the server side to share model metadata.

这篇关于Razor 模板、视图和 angular.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！