【问题标题】:Routing with Angular and Node使用 Angular 和 Node 进行路由
【发布时间】:2025-12-23 14:50:12
【问题描述】:

我正在学习 Node 和 Angular。作为我学习的一部分,我目前正在尝试设置一个包含三个页面的基本应用程序。为了做到这一点,我依赖于以下位置提供的文档:enter link description here

我的项目目前的结构如下:

/app
  /views
    page1.html
    page2.html
    page3.html
  /resources
    /javascript
      angular-1.0.7.min.js
      controllers.js
  index.html

我在 index.html 中的代码很简单。它看起来像这样:

<!doctype html>
<html ng-app="ngView">
  <head>
    <title></title>
    <script type="text/javascript" src="/resources/javascript/angular-1.0.7.min.js"></script>
    <script type="text/javascript" src="/resources/javascript/controllers.js"></script>
  </head>

  <body>
    <div ng-controller="Index">
        <a href="page1">Page 1</a>
        <a href="page2">Page 2</a>
        <a href="page3">Page 3</a>

        <div ng-view></div>
    </div>        

    <script type="text/javascript">
        angular.module('ngView', [], function ($routeProvider, $locationProvider) {
            $routeProvider.
                when('/page1', { templateUrl: 'app/views/page1.html', controller: Page1Controller }).
                when('/page2', { templateUrl: 'app/views/page2.html', controller: Page2Controller }).
                when('/page3', { templateUrl: 'app/views/page3.html', controller: Page3Controller }).
                otherwise({ redirectTo: 'app/views/page1' });

            $locationProvider.html5Mode(true);
        });
    </script>
  </body>
</html>

由于某种原因,我的视图与示例中的视图不同。什么设置不正确?

【问题讨论】:

  • 我相信你必须在你的节点服务器文件中设置你的路由以让 Angular 处理它们(我只用 Express + Node 完成了)
  • 可能需要查看该 controller.js 文件的内容
  • 是的 - 正如@BoxerBucks 所说,我们需要查看控制器的内容以及您如何设置 nodeJs 服务器...您是否处理过模板的交付或渲染?
  • 视图文件正在加载吗? Angular 在某些情况下存在子文件夹问题——尽管这通常与路由路径有关,而不是与视图的路径有关...

标签: javascript node.js angularjs


【解决方案1】:

您是否将正确的请求从节点服务器转发到 Angular?如果使用 express,这可能看起来像这样:

router.all('/*', function(req, res) {
    res.sendfile('index.html');
});

【讨论】: