2017-12-11 5 views
1

Angularで実行するWebアプリケーションをセットアップしてから少しです。私は古いプロジェクト(私がやっているページにコントローラを実装しようとしている、コントローラーファイルが正しく設定されていることなどを確認しようとしている)を使って歩みを進めていました。セットアップ。

私が使用しようとしているページを読み込むと、2つのエラーが表示され、ボタンを押したときにエクスプレスサーバへのGETコールが起動しません。これらのエラーは、次のとおりです。

angular.js:38 Uncaught Error: [$injector:nomod] http://errors.angularjs.org/1.5.6/$injector/nomod?p0=eagledreamApp 
    at angular.js:38 
    at angular.js:2101 
    at b (angular.js:2025) 
    at Object.module (angular.js:2099) 
    at mainpageController.js:1 
    (anonymous) @ angular.js:38 
    (anonymous) @ angular.js:2101 
    b @ angular.js:2025 
    (anonymous) @ angular.js:2099 
    (anonymous) @ mainpageController.js:1 
angular.js:38 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.6/$injector/modulerr?p0=eagledreamApp&p1=Error%3A%20%5B%24injector%3Anomod%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.5.6%2F%24injector%2Fnomod%3Fp0%3DeagledreamApp%0A%20%20%20%20at%20https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A6%3A412%0A%20%20%20%20at%20https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A25%3A235%0A%20%20%20%20at%20b%20(https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A24%3A282)%0A%20%20%20%20at%20https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A25%3A20%0A%20%20%20%20at%20https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A39%3A374%0A%20%20%20%20at%20q%20(https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A7%3A355)%0A%20%20%20%20at%20g%20(https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A39%3A222)%0A%20%20%20%20at%20db%20(https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A43%3A246)%0A%20%20%20%20at%20c%20(https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A21%3A19)%0A%20%20%20%20at%20Ac%20(https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A21%3A332) 
    at angular.js:38 
    at angular.js:4630 
    at q (angular.js:322) 
    at g (angular.js:4591) 
    at db (angular.js:4513) 
    at c (angular.js:1777) 
    at Ac (angular.js:1798) 
    at fe (angular.js:1683) 
    at angular.js:31018 
    at HTMLDocument.b (angular.js:3197) 

HTML:

<!DOCTYPE html> 
<html> 
<head> 
    <link rel="stylesheet" href="mainpageStyles.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
    <script src="mainpageController.js"></script> 
</head> 
<body ng-app="xyzApp" ng-controller="mainpageController"> 
    <div id="search"> 
     <button type="button" class="searchButton" ng-click="buttonpress()">Search</button> 
    </div> 
</body> 
</html> 

はコントローラー:

angular.module('xyzApp').controller('mainpageController', ['$scope', '$http', function($scope, $http){ 
    $scope.buttonpress = function() { 
     $http.get('/buttonpress') 
     .then(function(response) { 
      alert(response); 
     }); 
    }; 
}]); 

server.js(実行私は、コマンドラインでNPM server.jsを使用)

var express = require('express'); 
var app = express(); 
var fs = require('fs'); 
app.use(express.static(__dirname + '/Source')); 
app.listen(3000, function() { 
    console.log("Launch successful. To access app, open your browser and insert the following URL into your address bar: http://localhost:3000/"); 
}); 
app.get('/', function (req, res) { 
    console.log("Loading Home Page..."); 
    res.sendFile('/Source/mainpage.html', {root: __dirname }); 
}); 
app.get('/buttonpress', function (req, res) { 
    res.send("Hello World"); 
}) 

およびapp.js

angular.module('xyzApp'); 

(私は、この別のファイルを持っている必要があり、なぜ私は正確にわからないんだけど、それは私が私の他のプロジェクトが動作するようになった方法ですと「そのプロジェクトは、それ自身のアプリのファイルがあったが、ラインがangular.module('abcApp', ['ngSanitize']);だったと私はドンそのapp.jsファイルがなくてもプロジェクトが正しく動作するようになると思います。

答えて

1

angular.module('xyzApp',[]); 

angular.module('eagledreamApp'); 

からあなたapp.js

を変更

も私の悪い

<head> 
    <link rel="stylesheet" href="mainpageStyles.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
    <script src="app.js"></script> 
    <script src="mainpageController.js"></script> 
</head> 
+0

インデックスファイルにapp.jsを参照してください、私が実際に持っていますすべてが私のファイルで 'eagledreamApp'に設定されていますが、ポストするときにそれをxyzに振りかざすが、ポストでそのインスタンスを変更するのを忘れてしまった。 ありがとう!私はその頭を参照していないとそのエラーを実現しました。今私は同じフォルダにいなければならない奇妙な問題を抱えています。 app.jsをHTMLファイルの上のフォルダに入れようとすると、 '../ app.js'を実行するときに、同じコンソールエラーと2つの方法でファイルを見つけることができなくなります。 – Ryan

関連する問題