2016-04-08 8 views
0

はこれらが私の関連ファイルはAngularJS

<!doctype html> 
 
<html lang="en" ng-app="phonecatApp"> 
 

 
<head> 
 
    <script src="/js/angular-1.5.2/angular.js"></script> 
 
    <script src="/js/angular-1.5.2/angular-route.js"></script> 
 
    <script src="/js/app.js"></script> 
 
    <script src="/js/controllers.js"></script> 
 
</head> 
 

 
<body> 
 
    <!-- <p>Hello</p> --> 
 
    <div ng-view></div> 
 

 
</body> 
 

 
</html>

'use strict'; 
 

 
var PORT = 8080; 
 
var express = require('express'); 
 
var app = express(); 
 
var path = require('path'); 
 
var qs = require('querystring'); 
 
var http = require("http"); 
 
var url = require('url'); 
 
app.set('views', path.join(__dirname, 'views')); 
 

 
app.use(express.static('public')); 
 

 
app.get('/', function(req, res) { 
 
    res.sendFile(path.join(__dirname + '/views/index.html')); 
 
}); 
 

 
app.listen(PORT); 
 

 
console.log('Server listenning on port ' + PORT);

phonecatApp = angular.module('phonecatApp', ['ngRoute','phonecatControllers']); 
 
phonecatApp.config(['$routeProvider','$locationProvider', 
 
    function($routeProvider,$locationProvider) { 
 
    $routeProvider. 
 
     when('/phones', { 
 
     templateUrl: '/views/phone-list.html', 
 
     controller: 'PhoneListCtrl' 
 
     }). 
 
     when('/phones/:phoneId', { 
 
     templateUrl: 'phone-detail.html', 
 
     controller: 'PhoneDetailCtrl' 
 
     }). 
 
     otherwise({ 
 
     redirectTo: '/phones' 
 
     }); 
 
    }]);

でビューを見つけることができません。私はAngularJSとNodeJSで簡単なアプリケーションを構築していますが、問題は、NodeJS(localhost:8080)を使ってルートページにアクセスしようとすると、コンソールに "angular.js:11500 GET http://localhost:8080/views/phone-list.html 404見つけた)」。誰も私のページがng-viewディレクティブで読み込まれていないことを間違っていることを提案することができます。

+1

ファイルディレクトリはどのように見えますか?あなたは、ファイルパスが一致することを確認するためにブラウザでそのhtmlファイルを開こうとしましたか? –

+0

ファイルのディレクトリ構造はapp/views/index.htmlで、同様に私はapp/views/phone-list.htmlを持っています。私はそれがうまく動作しますが、サーバーを介して試したときにそれをフェッチするように見えないことを開こうとするとき。 –

答えて

0

templateUrlに絶対URLは必要ありません。

phonecatApp = angular.module('phonecatApp', ['ngRoute','phonecatControllers']); 
phonecatApp.config(['$routeProvider','$locationProvider', 
    function($routeProvider,$locationProvider) { 
    $routeProvider. 
     when('/phones', { 
     templateUrl: 'views/phone-list.html', 
     controller: 'PhoneListCtrl' 
     }). 
     when('/phones/:phoneId', { 
     templateUrl: 'views/phone-detail.html', 
     controller: 'PhoneDetailCtrl' 
     }). 
     otherwise({ 
     redirectTo: '/phones' 
     }); 
    }]); 

これを見てくださいtutorial

+0

もし私が( '/ phones'、{ templateUrl: 'phone-list.html'、 コントローラ: 'PhoneListCtrl' })//それでも何もしない場合は –

+0

私はすでにチュートリアルを見ていますが、これは私にとってはうまくいかないようです。チュートリアルで説明したのと同じ概念を使用しています。 –

関連する問題