MEAN堆棧，角度基本示例不起作用

我是MEAN堆棧的新手。我正在從許多網站做例子。MEAN堆棧，角度基本示例不起作用

但我只是不能走得更遠。

這裏是問題所在。

我的網絡服務器可以發送index.html和其他js文件。

但簡單的角度應用程序將無法正常工作。

這裏是代碼。的index.html

<!DOCTYPE html> 
<html> 
<head lang="en"> 
<meta charset="utf-,8"> 
<title>BTELI</title> 
</head> 
<body> 

<div ng-app="testApp"> 
<ng-view></ng-view> 
</div> 

<script src="bower_components/angular/angular.min.js"></script> 
<script src="javascripts/app.js"></script> 
</body> 
</html>

app.js

var app = angular.module("testApp",[]); 

app.config(function ($routeProvider) { 
$routeProvider.when('/', 
    { 
    templateUrl: "view/main.html", 
    controller: "MainCtrl" 
    } 
) 
}) 

app.controller("MainCtrl", function ($scope) { 
$scope.model = { 
    message:"This is MY APP!!!" 
} 
})

最後，main.html中

<h1>{{model.message}}</h1>

我真的沒有任何想法，爲什麼它不會工作。

因爲我可以訪問html源代碼中的那些js文件。

我該怎麼辦？

我不確定它是否有幫助，我附上我的服務器端代碼。

app.js

var express = require('express'); 
var path = require('path'); 
var favicon = require('static-favicon'); 
var logger = require('morgan'); 
var cookieParser = require('cookie-parser'); 
var bodyParser = require('body-parser'); 
var app = express(); 
app.enable('jsonp callback'); 
app.set('view engine', 'ejs'); 
app.set('views',__dirname+'/public/view'); 
app.use(favicon(__dirname+'/public/favicon.ico')); 
app.use(logger('dev')); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded()); 
app.use(express.static(path.join(__dirname, '/public'))); 

require('./server/routes/index.js')(app); 

app.use(function(req, res, next) { 
    var err = new Error('Not Found'); 
    err.status = 404; 
    next(err); 
}); 

if (app.get('env') === 'development') { 
    console.log('development mode'); 
    app.use(function(err, req, res, next) { 
     res.status(err.status || 500); 
     res.render('error', { 
      message: err.message, 
      error: err 
     }); 
    }); 
} 

app.use(function(err, req, res, next) { 
    res.status(err.status || 500); 
    res.render('error', { 
     message: err.message, 
     error: {} 
    }); 
}); 

app.listen(80,function(){ 
    console.log('Listening on Port 80'); 
}); 

module.exports = app;

和路由部分。

app.get('/', function(req, res) { 
    res.sendfile('index.html'); 
});

來源

2014-06-15 Hanjun koo

，您收到的輸出什麼？ – Claies

我收到了我附加的index.html頁面。但我想通過角度路由來查看main.html。 @Andrew –

換句話說，你的'ng-view'元素沒有被填充，而是顯示在頁面上？ – Claies

您的應用不包括ngRoute服務，因此不會有訪問$routeProvider。

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

index.html中

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.11/angular-route.js"></script>

https://docs.angularjs.org/api/ngRoute/service/%24route#example

時，你說，它不會工作

來源

2014-06-15 22:33:05 Claies

他還應該將ngRoute腳本文件添加到他的頁面中...... – SirDemon

非常感謝，在很多網站中，他們沒有這樣的'ngRoute'。這就是爲什麼我感到困惑=（但它現在運行良好，所以很感謝！ –

MEAN堆棧，角度基本示例不起作用

回答

相關問題