angularjs - 在 AngularJS 中以 RESTful 方式设置路由的最佳实践

Question

我正在使用 AngularJS 构建一个使用 REST 服务的 UI:

这是服务器 API

/items/ GET
/items/:id GET
/items/ POST (to create new item)
/items/:id PUT (to edit item)
/items/:id DELETE

在 Angular 中设置路由时的最佳实践是什么？这些路由将映射到服务器 REST API，但显然存在问题。我猜我需要将操作作为 URL 的一部分，对吗？像这样的事情:

Angular 路线:

/items/
/items/:id
/items/new 
/items/:id/edit
/items/:id/delete

但是上面的模式也有一个问题。/items/new 将匹配/items/:id 和/items/new 那么设置创建路由时的最佳实践是什么？

Answer 1

另请记住，您定义的客户端 Angular 路由可能取决于您的 UI。您定义的路由更像是传统的 Web 应用程序，您可以在其中单击“添加新”按钮，将您带到一个新页面，其中包含您填写的表单。但是，这可能不是您在单页应用程序 (SPA) 中使用的模式(通常使用 Angular 创建)。

我的意思是，我所做的大多数 SPA 应用实际上在客户端并没有独立的“/items/new”路由。相反，“/items/new”功能是在“/items/”路由/部分(传统 Web 应用术语中的“页面”)上处理的。此页面列出了现有项目，并且此页面上有一个表单，您可以填写该表单来创建新项目。或者，此页面上有一个“添加新”按钮(就像传统的网络应用程序一样)；但是，单击它要么以模态表单幻灯片，要么 ng-显示已在/items/部分模板上定义(但最初隐藏)的表单。

提交后， Controller 点击服务器上的“POST/items/”来创建新项目，使用 POST 的返回值更新范围(假设成功，这将是新项目信息)，并清除/重新隐藏"new"表单。

底线 - 请记住，在 SPA 中，如果 UI 中将 new 作为项目列表页面的功能进行处理，您实际上可能不需要“/items/new”。当然，如果您需要它成为一个独立页面作为可寻址端点(即您计划从多个位置链接到此页面，而不仅仅是从应用程序内)，那么您显然需要一条直接路由。

在我们的例子中，我们通常不需要在应用程序中为其指定命名路由，我们只需将其作为“/items/”路由的功能提供服务即可。