Angular 和 Express 路由如何在 mean.js 应用程序中协同工作？

Question

我正在为 Angular 和 Express Routing 苦苦挣扎（顺便说一下，我对 Express 还是个新手），我一直在处理 Angular 的路线 — ui-router — 但现在我开始构建 uild 一个 MEAN.js 应用程序，我注意到我可以处理服务器端路由和客户端路由……这就是让我明白的原因困惑，这是我的一些问题：

它们有什么不同？
如果我切换到 Express 路由，我还会有 SPA 吗？
我可以同时使用两者吗？如何？这是好的做法吗？有什么好处吗？
我什么时候应该只使用其中一个？
我将如何处理路由参数？
等...

如果有人能详细解释这些问题，以及其他人们需要知道的额外内容，我将不胜感激。

此外，我想知道的是：我是否只需要在 Express 中设置服务器，还是需要在 Node 中编写代码？

Answer 1

Express 中的路由与 angular

中的路由略有不同

快递中

Routing refers to the definition of end points (URIs) to an application and how it responds to client requests.

因此，如果您使用 angularjs 进行路由，则无需使用 express 为 html 模板设置路由。

您只需使用 express 创建 RESTAPI，然后使用 angularjs $http 或 $resource[= 使用这些 API 15=]

总结：

Angular 中的路由支持 SPA 背后的想法。最终你想通过 Angular 处理基于 UI 的路由更改（即不需要服务器 call/logic）。任何到达后端并最终需要服务器逻辑的路由更改都应该使用 Express 路由。

例子

这是创建休息的快速路由 API。

app = express();

app.get('/dowork',function(res,req){
    console.log(req.params.msg);
  /... code to do your work .../
});

现在在 angularjs 调用中工作

$http.get('http://localhost:8080/dowork',{"msg":"hi"}).success(function(data){
 console.log(data);
});

Answer 2

只需两美分。其他专家应该纠正我并进一步解释：

Routing at frontend 一般指在#后url中进行路由管理。这是因为 # 之后的任何内容都会被浏览器忽略。因此，angular 利用它在运行中进行 ajax 调用，并根据 # 之后的路由路径获取资源。

表示处理的是#前的url。这用于从浏览器向服务器发出实际请求。

它们有何不同：已回答

如果我切换到 Express 路由，我还会有 SPA 吗：

如果您在前端手动管理 urls，同时进行 ajax 调用以填充您的单个页面，则您始终可以拥有 SPA。在前端管理 url 应该以可读性为目的。

我可以同时使用两者吗？如何？ :

每个人都用。 SPA 也同时使用两者。通常基于身份验证的事情由快速路由处理，而授权和其他基于路由的交互（如请求资源等）则使用前端路由。即使你使用前端路由，对于后台的ajax请求，你仍然依赖express的路由。

这是个好习惯吗？它有什么好处吗？ :

使用 express 的路由进行身份验证并提供资源，并使用 angular 前端路由来保持 SPA 的运行始终是一个好习惯。

我什么时候应该只使用其中一个？ : 回答

我将如何处理路由参数？ :

前端使用路由参数（如果使用 ng-route）和后端使用 slug、bodyparser 等处理参数。你需要花点时间学习这些。

Answer 3

我们可以同时使用吗

当然你可以同时使用两者。根据您的应用程序要求，您的应用程序的哪些部分需要 spa 以获得更好的用户体验，哪些部分视图需要由您的 express 应用程序呈现。

如果我切换到 Express 路由，我还会有 SPA 吗？

如果 angular 不处理特定路由，并且您想通过 Express 应用程序生成视图，您可以这样做。如果你想开发一个完整的水疗中心，那么你需要在你的 express 应用程序中开发一个 api（http 端点）来响应你的 angular 应用程序的 AJAX 请求。 Angular 路由是所有关于 clint 端的路由，用于生成模板和从服务器（在您的情况下为 express）获取数据并呈现视图。在所有 angular 路由调用中，对快速路由的调用以获取 json 数据或任何模板以给人以水疗中心的印象

例子

快递我们有

app.get("/", function (req, res) {
    res.render("home");
});

您的主页必须包含所有 angular 脚本文件以初始化 angular 应用程序

在 clint 端代码中你可以有

var app = angular.module("myApp", ["ui.router"])
    .config(function ($stateProvider, ) {

        $stateProvider.state("home", {
            url: "/"
        })
         .state("manas", {
              url: "/manas",
              templateUrl: "/templates/manas.html"
              // when the state or url is manas its fetch the static  manas.html from server and inject that  to ui view
            })

// i am using angular UI router here

我可以同时使用两者吗？如何？这是好的做法吗？有什么好处吗？

是的，我们可以同时使用两者。这取决于您的应用程序逻辑，同时使用它们既没有害处也没有好处。

我什么时候应该只使用其中一个？ 仅当您更关心搜索引擎优化时才使用快速路由。因为 SPA 在默认情况下不是搜索引擎友好的，所以您需要采取一些额外的措施来使其对搜索引擎友好。

我将如何处理路由参数？ 这取决于您使用的 angular 路由。我的意思是普通 angular 路由或 UI 路由。但两者的概念相同

传递参数

用于通过 UI 路由将参数传递给服务器 https://github.com/angular-ui/ui-router/wiki/URL-Routing#url-parameters

对于 UI 路由遵循此 link https://github.com/angular-ui/ui-router/wiki

如果您的应用不是更复杂，您不关心嵌套视图、子视图等我的建议是 angular 普通路由。毫无疑问 UI 路由器提供了更先进的路由概念，但学习曲线也很陡峭。如果您的应用本质上很简单，请使用 angular 路由

Angular 和 Express 路由如何在 mean.js 应用程序中协同工作？

How does Angular and Express routing work together in a mean.js app?

url-routing

node.js

express

angularjs

mean-stack