爲什麼我的應用程序路由不起作用？

我使用angularJS並希望添加路由到我的應用程序。但我有錯誤：爲什麼我的應用程序路由不起作用？

Uncaught Error: [$injector:modulerr] Failed to instantiate module countriesModule due to: 
Error: [$injector:nomod] Module 'countriesModule' 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.

這是我的文件app.js：

var countryApp = angular.module('countryApp', ['ngRoute', 'countriesDataModule']); 

countryApp.config(['$routeProvider', function ($routeProvider) { 
    $routeProvider.when('data/', { 
     templateUrl : 'partials/countries.html', 
     controller : 'CountriesListCtrl' 
    }).when('data/:countryUrl', { 
     templateUrl : 'partials/country-details.html', 
     controller : 'CountryDetailsCtrl' 
    }).otherwise({ 
     redirectTo : '/countries' 
    }); 
}]);

和文件controllers.js：

var countriesDataModule = angular.module('countriesDataModule', []); 

countriesDataModule.controller('CountriesListCtrl', ['$scope', '$http', function ($scope, $http) { 
    $http.get('data/countries.json').success(function (data) { 
     $scope.countries = data; 
     $scope.selectedProp = 'countryId'; 
    }); 
}]); 

countriesDataModule.controller('CountryDetailsCtrl', ['scope', '$routeParams', function ($scope, $routeParams) { 
    $scope.countyUrl = $routeParams.countryUrl; 
}]);

index.html文件：

<!DOCTYPE html> 
<html lang="en" ng-app="countriesModule"> 
<head> 
    <meta charset="UTF-8"> 
    <link rel="stylesheet" type="text/css" href="css/common.css"> 
    <script src="bower_components/jquery-2.2.3.min/jquery-2.2.3.min.js"></script> 
    <script src="bower_components/angular/angular.js"></script> 
    <script src="bower_components/angular-route/angular-route.js"></script> 
    <script src="js/app.js"></script> 
    <script src="js/controllers.js"></script> 
    <title>Document</title> 
</head> 
<body> 
<div class="container"> 
    <header> 
     <h1>Сountry for travel</h1> 
    </header> 
    <main> 
     <div ng-view></div> 
    </main> 
</div> 
</body> 
</html>

我的項目結構：

我訪問其他網頁，看到有一些小技巧：

AngularJS 1.2 $injector:modulerr

Angular JS Uncaught Error: [$injector:modulerr]

https://docs.angularjs.org/error/ $injector/modulerr?p0=countriesModule&p1=%E2%80%A62Flocalhost:8080%2Fbower_components%2Fangular%2Fangular.min.js:21:19

但遺憾的是它並沒有幫助我

來源

2016-04-27 S.Hagvin

我只看到'countriesDataModule'的引用 – Ozrix

某處引用的是countriesModule，在代碼示例中未顯示 – Austin

錯誤：模塊'countriesModule'不可用！但我在我的應用程序中使用另一個模塊countriesDataModule。爲什麼我有這個錯誤？ –

有在代碼中任何沒有提及所謂的countriesModule你共享。

來源

2016-04-27 13:12:00 Kraken

爲什麼我的應用程序路由不起作用？

回答

相關問題