个人中心
gpt4 book ai didi

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

转载 作者：行者123 更新时间：2023-11-30 16:08:20 25 4
gpt4 key购买 nike

我需要有关使用 ui.router 进行路由的帮助。

我的文件夹结构是这样的:

enter image description here

在我的 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');
}]);

我的 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 :

<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>

当我做 npm start然后转到该网站，我得到一个无限循环，找不到 home.html .

我可以在 home.ejs 中编写代码如果我将它内嵌在 index.ejs 中就会出现使用 <script type="text/ng-template" id="/home.html">HOME_CODE_HERE</script> ;但是，我不想那样做。

我不确定如何解决这个问题。

最佳答案

ui.router 是 AngularJS，不是 NodeJS。无限循环 问题可能出在您的前端，而不是 NodeJS 路由中。

出于 AngularJS 的问题，我会说 Express 路由在后端，所以在请求(来自 Angular、浏览器、链接、重定向等)之后，工作所需的职责和配置在 NodeJS + Express + EJS.

假设您向 /index.html 发出请求。一旦请求到达后端，NodeJS 将假定如何处理它。

因此，为确保您在 NodeJS 中没有问题，请检查您的 app.js(在 Node 中使用 - 可能在项目的根目录中)。它可能具有与此类似的路由配置:

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" });
});

现在您可以在 NodeJS 中设置路由，然后可以设置 EJS 文件。您的 home.ejs 可以完全相同。index.ejs 文件会有点不同。也许你可以这样写(出于测试目的，我从中删除了 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>

在 Express github 页面中有一些关于路由和 EJS 的很好的例子: https://github.com/expressjs/express/tree/master/examples

我认为消除 NodeJS 的问题可以帮助您解决似乎在 AngularJS 中的问题。

希望对您有所帮助。

关于javascript - Node.js 和 expressjs 路由到另一个文件夹，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36672484/

25 4 0
文章推荐： c# - 从 Canvas 保存的图像未正确呈现
文章推荐： c - 在 C 中，如何从字符串中取出两个字符，并将它们分配为自己的字符串？
文章推荐： c# - WCF+ 计时器。不好的做法？
文章推荐： c# - Windows 窗体设置值不会在 session 之间保留
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com