2017-03-20 128 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); 
    }; 

回答