当前位置: 首页 > 知识库问答 >
问题:

Nodejs express呈现不使用ejs

张唯
2023-03-14

我正在节点服务器上使用express ejs在多视图应用程序中呈现视图。在客户端,我使用的是AngularJS。初始视图是一个登录页面,当使用res.render('pages/login')时,该页面会正确显示。我想在用户成功连接时呈现一个新的视图,但是对于下一个res.render('pages/home'),它仍然停留在登录页面上,尽管我在客户端接收到了正确的HTML。下面是我的相关代码:

部分文件结构:

   App
     public/js/Script.js
     views/pages
          login.ejs
          home.ejs
     server.js

server.js

...
app.get('/',function(req, res){
   res.render('pages/login'); //being displayed
});

app.get('/rest/home',function(req, res){
   res.render('pages/home'); //not being displayed
});
app.post('/login',function(req, res){
   //authentification
});
...

Script.js

.controller ('loginController', function ($scope, $http) {     
   $scope.authent = function(){
      $http({
         method: 'POST',
         url: '/login',
         data: $.param($scope.loginData),
         headers : { 'Content-Type': 'application/x-www-form-urlencoded' }
      }).success(function(res){
         $scope.launch();
      });
   $scope.launch = function(){
      $http({
         method: 'GET',
         url: '/rest/home',
      }).success(function(res){
         alert(res); //Here, I am getting the content of home.ejs, but the view doesn't load in browser
      });     
   };      
})
.controller ('homeController', function () {
});

login.ejs

<html ng-app="App">
<head>
       ...
</head>
<body  ng-controller="loginController">
    <div id="loginView">
       <form name="login" id="login" ng-submit="authent()">
          <input id="login_id" name="login_id" type="text" ng-model="loginData.loginId"/> 
          <input id="password" name="password" type="password" ng-model="loginData.password"/>
          <input type="submit" class="submit" value="Login"/>
       </form>
    </div>
</body>
</html>

Home.ejs

<html ng-app="App">
<head>
   ...
</head>
<body  ng-controller="homeController">
   <h1>Home</h1>
</body>
</html>

这是我第一次将ejs与angularjs一起使用,我对我的方法不是很确定,所以任何关于更好方法的建议也是受欢迎的。我试过用路由,但不是很满意。我希望我的解释清楚。

共有1个答案

长孙嘉
2023-03-14

最后,我使用了$routeprovider。解决方法如下:

文件结构:

App
  /public/js/Script.js
  /views/
       layout.ejs
       /partials/
          login.ejs
          home.ejs
  /routes/
       index.js
  server.js

server.js

...
var engine = require('ejs-locals');
var routes = require('./routes');
app.engine('ejs', engine);

app.set('view engine', 'ejs');
app.set('views', __dirname + '/views');    
app.get('/partials/:name', routes.partials);
app.get('/', routes.index); //Important to place this last
...

index.js

exports.index = function(req, res){
   res.render('layout');
};

exports.partials = function (req, res) {
   var name = req.params.name;
   res.render('partials/' + name);
};

Script.js

app.config(function ($routeProvider, $locationProvider) {
   $locationProvider.html5Mode(true);
   $routeProvider
      .when('/', {
         templateUrl : 'partials/login',
         controller  : 'loginController'
      })
      .when('/home', {
         templateUrl : 'partials/home',
         controller  : 'homeController'
      })
      .otherwise({redirectTo: "/"});
})
app.controller ('loginController', function ($scope, $http) {     
  ...
   $scope.launch = function(){
      $http({
         ...
      }).success(function(res){
         $location.path('/home');  
      });     
   };      
})

layout.ejs

...
<body>
   ...
   <div ng-view></div> <!-- This section will be replaced with rendered view -->
   ...
</body>
...
 类似资料:
  • 这是用reactjs呈现原始html的唯一方法吗? 我知道有一些很酷的方法用JSX标记东西,但我主要感兴趣的是能够渲染原始的html(所有的类,内联样式等)。像这样复杂的东西: 我不想在JSX中重写所有这些。 也许我对这一切的想法都错了。请纠正我。

  • 我有一个版本为2.2.4的Grails应用程序。我试图将一个gsp呈现为一个字符串参数,并将其发送到Mandrill模板以作为邮件发送。代码如下 普惠制如下 当我在本地测试时,它按预期工作。但当我在开发环境中测试这个时,“view”参数总是空的。 这有什么具体原因吗?这个问题让我困惑,因为我想不出这个问题的逻辑原因,因为它在我的本地机器上工作。此外,当它在开发环境中执行时,它不会抛出任何错误消息,

  • 问题内容: 我知道与此类似的问题:Pdf.js:使用base64文件源而不是url呈现pdf文件。Codetoffel很好地回答了这个问题,但是我的问题不同之处在于,通过对我的WebAPI实现的RESTful调用来检索我的PDF。让我解释… 首先,这是使用PDF.JS通过URL打开PDF的基本方法: 这很好用,但是我正在使用Angular及其服务通过我的RESTful Web API来请求PDF。

  • 我正在尝试使用Thymeleaf呈现电子邮件模板,我希望主题和正文在同一个文件中,但分别呈现。我不想使用spring视图,只想使用普通的。 这有几个问题 首先,我无法获取Thymeleaf仅渲染

  • 当我运行应用程序时,视图上只显示hello world而不显示name变量,在这里搜索之后,我将视图目录从src/main/webapp/view更改为src/main/resource/templates,但是spring boot再也找不到该视图了

  • 我正在尝试在表FORNMAT中显示数据。数据来自API。我需要显示表一旦数据接收从api。我正在使用类组件。下面我给出了尝试的东西。 //下面是我的jsx //下面是我从api获取数据的函数 //下面是我的api输出