2016-06-17 4 views
0

Я задавался вопросом, можете ли вы помочь.Ошибка загрузки маршрута AngularJS

Я изучаю AngularJS и решил использовать библиотеку Angular Route. У меня ошибка при попытке загрузить его.

angular.js:38Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.0/$injector/modulerr?p0=jargonBuster&p1=Err…loudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.3.0%2Fangular.min.js%3A18%3A3) 

Вот мой код, я изменил ссылки на то, что работает без удовольствия.

HTML

<!DOCTYPE html> 
<html ng-app = "jargonBuster"> 
<head> 
    <meta charset="utf-8"> 
    <title>Angular.js Example</title> 
    <link type="text/css" rel="stylesheet" href="style.css"/> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.0/angular.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.14/angular-route.js"></script> 

</head> 
<body> 
    <section ng-controller="MainCtrl"></section><!-- VIEW --> 
</body> 
</html> 
<script src="script.js"></script> 

JS

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

//router 
app.config(function($routeProvider) { 
    $routeProvider. 
    when('/', { 
     templateUrl:'keyword-list.html', 
     controller: 'MainCtrl' 
    }). 
    otherwise({ 
     redirectTo: '/' 
    }); 
}); 


// The Controller 
app.controller('MainCtrl', function($scope, $http) { 
    $http.get("getdecks.php").success(function(data) { //Gets data from The Decks Table 
     $scope.deckData = data;}); 
    $http.get("getcards.php").success(function(data) { //Gets data from The Cards Table 
     $scope.cardsData = data;}); 

    $scope.sortField = 'keyword'; 
    $scope.reverse = true; 

});// End of the controller 

Спасибо, любые идеи?

+0

удалить 'нг-контроллер =«MainCtrl»' из HTML –

+0

Также одно наблюдение. сценарий го при нагрузках «угловой маршрут» равен «1.3.14», но ваш основной угловой скрипт «1.3.0». Попробуйте изменить скрипт для angular.js на '1.3.14' – Lexi

ответ

3

Проблема на самом деле ваш HTML разметки. Если вы измените его с

<section ng-controller="MainCtrl"></section> 

в

<section ng-view></section> 

Вы должны увидеть загрузку шаблона (при условии, другие ошибки, не подрезать вверх по течению вниз в ключевые слова, list.html файл, который вы не сделали обеспечить.

настроить свой код с помощью простого ключевого слова-list.html файл самостоятельно, и она отлично работает.

+0

Удивительный, спасибо. Это сработало :) – HybridHaylee

-1

Вы загружаете 2 разных версии углов, и я считаю, что они конфликтуют. Ваш скрипт angular-route.js - это более новая версия, чем ваш сценарий angular.js. Попробуйте обновить его ниже.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"></script> 
0

вы положить вам сценарий, который содержит определение вне HTML

вы можете попробовать этот порядок

<!DOCTYPE html> 
<html ng-app = "jargonBuster"> 
<head> 
<meta charset="utf-8"> 
<title>Angular.js Example</title> 
<link type="text/css" rel="stylesheet" href="style.css"/> 


</head> 
<body> 
<section ng-controller="MainCtrl"></section><!-- VIEW --> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.0/angular.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.14/angular-route.js"></script> 
<script src="script.js"></script> 
</body> 
</html> 
+1

Вам на самом деле не нужно это делать. Это чаще встречается в сценариях js в главном теге, если только сценарии не предназначены для фантастических анимаций. –

+0

Связанная с этим проблема связана с тем, что скрипт, который содержит модуль, определяет вне html – abdoutelb

+0

Теперь я понимаю, что вы имеете в виду, когда вы сказали, что его скрипт находится вне html, я не заметил, что он все это проложил в нижней части файла , Он должен поместить свои собственные скрипты js после угловых js-скриптов в главном теге –

Смежные вопросы