Node.js和expressjs路由到另一个文件夹

Question

I need help with routing using ui.router. 我需要使用ui.router进行路由的帮助。

My folder structure looks like this: 我的文件夹结构如下所示：

In my app.js under javascripts looks like this: 在我的app.js ， javascripts如下所示：

var app = angular.module('testing', ['ui.router']);

app.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('home', {
        url: '/home',
        templateUrl: '/home.html'
    })
    .state('client_form', {
        url: '/request',
        templateUrl: '/client.html',
        controller: 'MainCtrl'
    });

  $urlRouterProvider.otherwise('home');
}]);

My index.ejs looks like this: 我的index.ejs看起来像这样：

<!DOCTYPE html>
<html>
    <head>
        <title>Testing</title>
        <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">

        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.10/angular.min.js"></script>
        <script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.js"></script>
        <script src="/javascripts/app.js"></script>
    </head>

    <body ng-app="testing">

        <div class="col-md-6 col-md-offset-3">
            <ui-view></ui-view>
        </div>

    </body>
</html>

home.ejs : home.ejs ：

<div class="page-header text-center" style="font-size:45px">
  Hacker List
</div>

<div class="text-center">
    <a href="worker.html">
        <button type="submit" class="btn btn-primary btnBig">Worker</button>
    </a>

    <br />

    <a href="Client.html">
        <button type="submit" class="btn btn-primary btnBig">Client</button>
    </a>
</div>

When I do npm start and go to the website, I get an infinite loop of it not finding home.html . 当我执行npm start并转到网站时，我陷入了无限循环，找不到home.html 。

I can make the code in home.ejs appear if I make it inline inside index.ejs using <script type="text/ng-template" id="/home.html">HOME_CODE_HERE</script> ; 我可以使在代码home.ejs出现，如果我使它里面的内联index.ejs使用<script type="text/ng-template" id="/home.html">HOME_CODE_HERE</script> ; however, I don't want to do that. 但是，我不想这样做。

I'm not sure how to fix this. 我不确定如何解决此问题。

Answer 1

The ui.router is AngularJS, not NodeJS. ui.router是AngularJS，而不是ui.router 。 Probably the infinite loop problem is in your front-end, not in NodeJS routes. 无限循环问题可能在您的前端，而不是在NodeJS路由中。

Out of the AngularJS problem, I would say that Express routes are in the back-end, so after a request (from Angular, browser, link, redirection etc) the responsibility and configuration needed to work is in NodeJS + Express + EJS. 出于AngularJS的问题，我想说Express路由位于后端，因此在请求（来自Angular，浏览器，链接，重定向等）后，所需的职责和配置在NodeJS + Express + EJS中。

Let's say you make a request to your /index.html . 假设您向/index.html发送请求。 Once the request gets in the back-end, NodeJS will assume how to handle it. 一旦请求进入后端，NodeJS将假定如何处理它。

So, to make sure you don't have a problem in NodeJS, check your app.js (used in node - probably in the root of your project). 因此，为确保您在NodeJS中没有问题，请检查app.js （在node中使用-可能在项目的根目录中）。 It could have the routing config similar with this: 它可能具有与此类似的路由配置：

 var express = require('express'); var app = express(); // EJS template config app.set('views','./views'); app.set('view engine','ejs'); app.use(bodyParser.urlencoded({ extended: true })); //support x-www-form-urlencoded app.use(bodyParser.json()); // This is your routes app.get('/', function(req, res) { // Your code for index res.render('views/index', { param : "This is a EJS test" }); }); app.get('/index.html', function(req, res) { // Your code for index res.render('views/index', { param : "This is a EJS test" }); }); app.get('/anotherPage.html', function(req, res) { // Your code for another page: can include validations here res.render('views/anotherPage', { param : "This is a EJS test" }); });

Now you would have your route set in NodeJS, then you could set your EJS files. 现在，您可以在NodeJS中设置路由，然后可以设置EJS文件。 Your home.ejs can be exactly the same. 您的home.ejs可以完全相同。 The index.ejs file would be a little different. index.ejs文件将有所不同。 Maybe you could write it like this (I removed AngularJS from it for testing purposes): 也许您可以这样写（出于测试目的，我从中删除了AngularJS）：

 <!DOCTYPE html> <html> <head> <title>Testing</title> <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> </head> <body> This is a parameter from the back-end: <%= param %> This is the index of EJS template. Below the snipped inserted: <div class="col-md-6 col-md-offset-3"> <% include home.ejs %> </div> </body> </html>

There are some good examples about routes and EJS in Express github page: https://github.com/expressjs/express/tree/master/examples Express github页面中有一些关于路由和EJS的很好的示例： https : //github.com/expressjs/express/tree/master/examples

I think that eliminating the problem with NodeJS can help you to fix the problem that seems to be in AngularJS. 我认为消除NodeJS的问题可以帮助您解决AngularJS中似乎存在的问题。

Hope it's somehow helpful. 希望对您有所帮助。

Node.js和expressjs路由到另一个文件夹

问题描述

1 个解决方案

解决方案1
2 已采纳 2016-04-17 05:21:35

Node.js和expressjs路由到另一个文件夹

问题描述

1 个解决方案

解决方案1 2 已采纳 2016-04-17 05:21:35

解决方案1
2 已采纳 2016-04-17 05:21:35