【问题标题】:How do I render partials and jade files with Angular and Express 4.0?如何使用 Angular 和 Express 4.0 渲染部分和玉文件?
【发布时间】:2015-11-02 21:36:31
【问题描述】:

我在网上查了几个地方,但大部分都是 Express 2-3。我知道我需要将有关部分的信息放在某处,但我不知道在哪里或如何准确地映射出来。基本上,我的页面从 '/' 到 '/game',我想在其中有一个 SPA,但是我在此页面内呈现玉模板时遇到问题。我复制了一个测试页面,但试图让它从 /views 或 /partials 加载某些内容时,我一直在导致崩溃。由于我的页面变得很重而不是在索引上,我不明白将有关部分的代码放在哪里。在 app.js 中?在game.js中?在 index.js 中?别的地方?我到底放了什么?

在 layout.js 中

doctype html
html
  head
    title test title
     script(src='http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js')
    script(src='http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-route.min.js')
    script(src='script.js')
    link(rel='stylesheet', href='/stylesheets/style.css')
  body
    block content

在 app.js 中

// catch-all route so non-explicitly defined routes load angular routes
app.get('*', function(req, res){
    res.render('home'); //
});

home.jade

extends layout
block content
  body(ng-app='RoutingApp')
    h2 AngularJS Routing Example
    p
      | Jump to the 
      a(href='#first') first
      |  or 
      a(href='#second') second page
    div(ng-view='')

script.js

var app = angular.module('RoutingApp', ['ngRoute']);

app.config( ['$routeProvider', function($routeProvider) 
    {
    $routeProvider
        .when('/first', {
            // templateUrl: 'views/last' // THIS CRASHES THE PAGE
            // templateUrl: 'last' // so does this
            templateUrl: 'last.jade' // this doesn't, but serves up static file instead of rendering jade
        })
        .when('/second', {
            templateUrl: 'second.html'
        })
        .otherwise({
            redirectTo: '/'
        });
    }]);

【问题讨论】:

    标签: angularjs express pug partials


    【解决方案1】:

    路由已经注册到/,所以你需要使用href作为#/first & #/second

    p
      | Jump to the 
      a(href='#/first') first
      |  or 
      a(href='#/second') second page
    

    【讨论】:

    • @CustardBoy 有帮助吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-08-22
    • 1970-01-01
    • 2017-09-02
    • 1970-01-01
    • 2015-07-17
    相关资源
    最近更新 更多