Jade没有在Angular Routing上工作

我使用expressjs作为web服务器,还有玉器。 我正在使用angularjs做客户端路由,但我的UI并不是我期望的是我的代码和输出

var express = require('express'); var morgan = require('morgan'); var app = express(); app.use(express.static(__dirname + '/public')); app.use(morgan('dev')); app.set('view engine', 'jade'); app.get('/', function (req, res) { res.render("layout.jade"); }); app.listen(3030); 

layout.jade

 doctype html html(ng-app="myapporder") head title my orders app include scripts.jade body block body h1 orders div(ng-view) 

angapp.js

 (function(){ var app = angular.module('myapporder' , ['ngRoute']); app.config(function($routeProvider){ $routeProvider .when('/' , { controller : 'customerController' , templateUrl : 'customer' }) .otherwise({ redirectTo :'/'}); }); }()); 

customer.jade

 div.container p. Search <input type='text' ng-model='cusfil'></input> table.table.table-hover.table-bordered tr th(ng-click="dosort('name')") name th(ng-click="dosort('city')") city th(ng-click="dosort('cost')") cost th(ng-click="dosort('date')") date tr(ng-repeat='cust in customers | filter:cusfil | orderBy:sortby:reverse') td {{ cust.name}} td {{ cust.city}} td {{ cust.cost | currency}} td {{ cust.date}} span total customers {{customers.length}} 

customercontroller.js

 (function(){ var CustControl = function ($scope){ $scope.customers=[{name:'tina' , city:'yina' , cost :4.9987 , date:'200-12-11'} , {name:'yina' , city:'yina' , cost :3.44 , date:'200-12-11'}]; $scope.dosort = function(idw){ $scope.sortby = idw; $scope.reverse = !$scope.reverse; }; } angular.module('myapporder').controller('customerController' , CustControl); }()); 

而不是显示文本输出还显示div,h1等标签输出

订单div.container页。 searchtable.table.table-hover.table-bordered tr th(ng-click =“dosort('name')”)name th(ng-click =“dosort('city')”)city th(ng-click =“dosort('cost')”)cost th(ng-click =“dosort('date')”)date tr(ng-repeat ='cust in customers | filter:cusfil | orderBy:sortby:reverse')td td td td跨度总客户2

你不能在客户端渲染Jade模板。 服务器需要渲染它们。

所以你可以添加一个路由到你的快递服务器,呈现模板。

 app.get('/template/:name', function(req, server) { var name = req.params.name; server.render('templates/' + name); }); 

上面的代码部分呈现代码,然后编辑您的AngularJS路线来访问这个URL。

 $routeProvider .when('/' , { controller : 'customerController' , templateUrl : 'template/customer.jade' }) .otherwise({ redirectTo :'/'}); }); 

Jade模板必须由服务器呈现,然后发送到客户端。 我相信angular路由只会采取静态HTML文件,除非你向服务器发出请求。