Question

我正在用MEAN堆栈开发我的第一个小而简单的应用程序但是我有一些角度问题（我正在学习它）并且我在没有找到解决方案的情况下搜索了答案。我在我的项目中有以下文件，但是当我转到localhost：3000时，我收到此错误：

Failed to instantiate module hiking-app due to:
[$injector:nomod] Module 'hiking-app' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

我的档案：

ROUTER.JS

angular.module("hiking-app",[]).
config(function($routeProvider)
{
    $routeProvider.
    when('/alpi', 
    {
        template : 'partials/basic-template.html', controller:AlpiCtrl
    }).
    when('/ande', 
    {
        template : 'partials/basic-template.html', controller:AndeCtrl
    }).
    when('/dolomiti', 
    {
        template : 'partials/basic-template.html', controller:DolomitiCtrl
    }).

    otherwise({redirectTo:'/home', template:'partials/home.html'});
});

function MainCtrl($scope, $location)
{
    $scope.setRoute = function(route)
    {
        $location.path(route);
    }
}

function AlpiCtrl($scope)
{
    $scope.title = "ALPI";
    $scope.body = "test ";
}

function AndeCtrl($scope)
{
    $scope.title = "ANDE";
    $scope.body = "test ";
}

function DolomitiCtrl($scope)
{
    $scope.title = "DOLOMITI";
    $scope.body = "test ";
}

INDEX.HTML

<html ng-app="hiking-app">
    <head>
    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css"/>
    <link rel="stylesheet" href="css/main.css" />
    <script src="app.js"></script>
    <script src="node_modules/angular/angular.js"></script>
    <script src="node_modules/angular-route/angular-route.js"></script>
    <script src="router.js"></script>    

    </head>

      <div id="header"><img src="img/hiking-header.png" /></div>
    <body ng-controller="MainCtrl">
        <nav class="navbar navbar-default" ng-controller="NavigationController">
        <table id="menutable">
            <tr>
            <td><a ng-click="setRoute('alpi')">Alpi</a></td>
                <td><a ng-click="setRoute('ande')">Ande</a></td>
                <td><a ng-click="setRoute('dolomiti')">Dolomiti</a></td>
                <td><a ng-href="{{himalaya}}">Himalaya</a></td>
            <td><input type="button" value="REGISTRATI" id="btnreg"></input></td>
            <td><input type="button" value="LOGIN" id="btnlogin"></input></td>
           </tr>
        </table>
            </nav>
        <div class="container">
        <div ng-view></div> 
        </div>
    </nav>
 </body>   
</html>

BASIC-TEMPLATE.HTML

<h1>{{title}}</h1>
<p>{{body}}</p>

APP.JS

var express = require('express'),
app = express();
var server = require('http').createServer(app);
var mongoose = require('mongoose');

app.use('/app', express.static(__dirname));
app.use('/node_modules', express.static(__dirname + "/node_modules"));
app.use('/img',express.static(__dirname + "/img"));
app.use('/css',express.static(__dirname + "/css"));

server.listen(3000);

mongoose.connect('mongodb://127.0.0.1/mountains', function(err){
    if(err){
        console.log(err);
    } else{
        console.log('Connected to mongodb!');
    }
});

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

Answer 1

加载角度脚本后，

router.js应该在那里。因为它需要angular个模块和它的对象已预先加载。

此外，您需要在应用程序中注入ngRoute模块，以确保路由引擎应该在那里。

angular.module("hiking-app",['ngRoute'])

<强>脚本

<script src="/app.js"></script>
<script src="node_modules/angular/angular.js"></script>
<script src="node_modules/angular-route/angular-route.js"></script>
<script src="/router.js"></script>

无法实例化模块 - angular

1 个答案: