angularjs 和 mvc5 之间通信的最佳方式是什么?

What's the best way to communicate between angularjs and mvc5?

我对在 angularjs 和 MVC5 之间传输数据有些困惑。我正在创建单页应用程序 (SPA)。

  1. 使用 angularjs 的最佳方式是什么?是 MVC 控制器还是 MVC API?
  2. 我读到 here api 对 SPA 很有用。那么,我是否需要为 API 构建不同的项目?
  3. Angularjs 与 MVC 的异步通信如何?

我没有找到正确的前进方向。我熟悉 mvc 但不熟悉 API。所以,请指导我正确的方法!!

提前致谢

1) 您可以创建简单的 Controller - 并在内部创建将 return JsonResult 的方法 并通过 AJAX

从 Angular 调用这些方法

2) 是的 - 如果你想要构建 API - 你需要创建 WebAPi 的新项目类型(现在是 v 2.0) - 但你可以在一个 solution 与 SPA

3) 您可以拨打 ajax asynchronous - 这不是问题

首先,对于 Visual Studio (2013) 的当前版本,"web form" 项目和 "mvc" 项目之间没有区别。就一个web应用项目,里面随便放什么东西

根据我的经验,现在解决您的问题的一种简洁明了的方法是创建普通的 MVC 控制器来呈现包含 angularJS 应用程序的剃刀视图,并为 RESTful ajax 方法的接口。

在 angularJS 中,您实际上不需要手动执行 ajax 调用。还有一种更方便、更强大的方式:资源。它们也与 WebAPI 设计配合得很好,因为 WebAPI 控制器与单一类型的对象(即客户)一起工作,并且通过 HTTP VERBS 允许您执行 CRUD。例如:

// assume we have a backend repository that handles the data

public HttpResponseMessage Get()
{
    return this.Request.CreateResponse(HttpStatusCode.OK, this.repository.GetAllCustomers()); 
}

public HttpResponseMessage Post(Customer customer)
{
    var modifiedCustomer = this.repository.Update(customer);
    this.repository.SaveChanges();

    return this.Request.CreateResponse(HttpStatusCode.OK, modifiedCustomer);
}

此方法查询所有可用的客户并return发送他们。您不在这里定义是 return JSON 还是 XML:WebAPI 框架读取 WebAPI 请求的 HTTP HEADERS 并按照客户端请求序列化数据。对于您可能会使用的 JSON,它通过定义的默认 JSON 序列化程序进行序列化。您可以覆盖它以更改 JSON 的创建方式,一种常见的方法是使用 JSON.NET 和自定义设置。

AngularJS 资源用于映射单个 URL 并在内部处理所有动词,并向您公开 $save、$query、$get 等方法,因此它们耦合在一起很好。例如:

var customerRes =  $resource('/customers');
var currentCustomers = customerRes.query(function(){ // query is mapped to the GET verb
    currentCustomers[0].email = "foo@baz.bar";
    currentCustomers[0].$save(); // default mapped to the POST verb
});

我建议您查看文档和示例以了解更多详细信息。

您可以将 MVC 控制器功能与 Async 和 MVC API 一起使用。在控制器异步方法中,您需要手动处理所有响应,因为 API 具有内置的许多功能。在控制器异步方法中,您的应用程序将处理自调用。 当然 API 让您更灵活地处理不同的应用程序类型。

当您的 MVC 应用程序针对不同类型的应用程序(如移动应用程序等)有 APIs 时,您需要担心更多事情。 1. 泳池服务。 2. IIS 中每个工作进程的线程数。 当您在应用程序中针对不同类型的应用程序使用 APIs 或异步方法时,这些将定义您的应用程序的规模。