2017-03-20 126 views
2

编辑: 嗨,大家好,我的代码是正确的。我不得不使用$ locationProvider从Url删除'#'。这是问题;)Express和Angular路由

我正在学习做一个简单的拍卖应用程序的平均堆栈。 我有一些问题了解如何表达和角度路由一起工作。

我的节点服务器,在服务这个文件,app.js

var express = require('express'); 
    var path = require('path'); 
    var favicon = require('serve-favicon'); 
    var logger = require('morgan'); 
    var cookieParser = require('cookie-parser'); 
    var bodyParser = require('body-parser'); 
    var routes = require('./routes'); 

    var mongoose = require('mongoose'); 

    var app = express(); 

    mongoose.connect('localhost:27017/auction'); 

    // view engine setup 
    app.set('views', path.join(__dirname, '/views')); 
    app.set('view engine', 'jade'); 

    app.use(favicon(path.join(__dirname, 'public', 'favicon.ico'))); 
    app.use(logger('dev')); 
    app.use(bodyParser.json()); 
    app.use(bodyParser.urlencoded({ extended: false })); 
    app.use(cookieParser()); 
    app.use(express.static(path.join(__dirname, 'public'))); 

    app.get('/partials/:filename', routes.partials); 

    app.use(routes.index); 

我有一个正常的index.jade并呼吁auction.js中,我做的角路由,像这样的角度应用:

var app = angular.module('auction', [ 'ngRoute','HomeCtrl','NewAuctionCtrl', 'FollowingAuctionsCtrl','MyAuctionsCtrl']); 


    app.config(function ($routeProvider){ 

    $routeProvider 
     .when('/myauctions', { 
      templateUrl: 'partials/myauctions.jade', 
      controller: 'MyAuctionsController' 
     }) 
     .when('/followingauctions', { 
      templateUrl: 'partials/followingauctions.jade', 
      controller: 'FollowingAuctionsController' 
     }) 
     .when('/users', { 
      templateUrl: 'partials/users.jade', 
      controller: 'UsersController' 
     }) 
     .when('/newauction', { 
      templateUrl: 'partials/newauction.jade', 
      controller: 'NewAuctionController' 
     }) 
     .otherwise({redirectTo:'/'}); 

});

我没有任何控制台错误,服务器负载index.jade,但是当我在我的导航栏中导航时,没有发生任何事情,我在其他玉文件或与控制器。这是应用程序的结构:

-bin(server) 
    -models(for mongoose) 
    -public 
     -images 
     -javascripts 
      -auction.js 
      -controllers 
      -services 
     -stylesheets 
    -routes 
     -index.js 
    -views 
     -partials 
     -the other jade files 
     -index.jade 
    -app.js 

这是index.jade文件(仅导航栏部分)

#auction-navbar 
    nav.navbar.navbar-default 
    .container-fluid 
     // Brand and toggle get grouped for better mobile display 
     .navbar-header 
     button.navbar-toggle.collapsed(type='button', data-toggle='collapse', data-target='#bs-example-navbar-collapse-1', aria-expanded='false') 
      span.sr-only Toggle navigation 
      span.icon-bar 
      span.icon-bar 
      span.icon-bar 
     // Collect the nav links, forms, and other content for toggling 
     #bs-example-navbar-collapse-1.collapse.navbar-collapse 
     ul.nav.navbar-nav 
      li 
      a(href='/') 
       | Dashboard 
      li 
      a(href='/myauctions') 
       | My auctions 
      li 
      a(href='/followingauctions') 
       | Following Auctions 
      li 
      a.btn.btn-primary(href='/newauction') 
       | New Auction 



    #content(ng-view) 

这是index.js文件

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

    exports.partials = function (req, res) { 
     var filename= req.params.filename; 
     if(!filename) return; 
     res.render('partials/' + filename); 
    }; 

回答