2014-11-05 3 views
1

Я делаю учебник о angularjs. Все хорошо, пока не будет работать с маршрутом. Я искал эту проблему раньше, но это не работает для меня.
Я делаю именно тот код, который тип автора, но он не работает. нг вида положить в index.htmlng-view not show with Route (angularjs)

<html ng-app="githubViewer"> 
<head> 
    <title>Demo</title> 
    <script type="text/javascript" src="js/angular.min.js"></script> 
    <script type="text/javascript" src="js/angular-route.js"></script> 
    <script type="text/javascript" src="app.js"></script> 
    <script type="text/javascript" src="MainController.js"></script> 
    <script type="text/javascript" src="github.js"></script> 
</head> 
<body> 
    <h1>Github Viewer</h1> 
    <div ng-view=""></div> 
</body> 

app.js

(function() { 
var app = angular.module("githubViewer", ["ngRoute"]); 
app.config(function($routeProvider) { 
    $routeProvider 
      .when("/main", { 
       templateUrl: "main.html", 
       controller: "MainController" 
      }) 
        .otherwise({redirectTo:"/main"}); 
});})();  

MainController.js

(function() { 
var app = angular.module("githubViewer"); 
var MainController = function(
     $scope, $interval, $location) { 
    var decrementCountdown = function() { 
     $scope.countdown -= 1; 
     if ($scope.countdown < 1) { 
      $scope.search($scope.username); 
     } 
    }; 
    var countdownInterval = null; 
    var startCountdown = function() { 
     countdownInterval = $interval(decrementCountdown, 1000, 5, $scope.countdown); 
    }; 
    $scope.search = function(username) { 
     if (countdownInterval) { 
      $interval.cancel(countdownInterval); 
      $scope.countdown = null; 
     } 
    }; 
    $scope.username = "angular"; 
    $scope.countdown = 5; 
    startCountdown(); 
}; 
app.controller("MainController", MainController);})(); 

main.html

<div> 
{{countdown}} 
    {{username}} 
    <form name="searchUser" ng-submit="search(username)"> 
     <input type="search" required placeholder="usẻname to ind" ng-model="username" /> 
     <input type="submit" value="Search" ng-click="search(username)"> 
    </form> 

github.js

(function() { 

var github = function($http) { 

var getUser = function(username){ 
    return $http.get("https://api.github.com/users/" + username) 
      .then(function(response){ 
       return response.data; 
    }); 
}; 

    var getRepos = function(user){ 
     return $http.get(user.repos_url) 
       .then(function(response){ 
        return response.data; 
     }); 
    }; 

    return{ 
     getUser : getUser, 
     getRepos: getRepos 
    }; 
}; 

var module = angular.module("githubViewer"); 
module.factory("github", github);})(); 

ответ

0

У вас ошибка в коде:

var MainController = function($scope, $interval, , $location) { 
        // unnecessary comma here ----^ 

Удалить запятую (или вставки отсутствует параметр) и ваше приложение должно начать работать ,

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

+0

Это моя ошибка, когда я вставляю этот код туда. В моем источнике это правильно. Я думаю, что это проблема с Маршрутом, который я использую. –

+0

Еще вопрос: есть ли ошибки в консоли? – dfsq

+0

Да. В MainController.js, если я ставлю [] следующим образом: var app = angular.module ("githubViewer", []); это не ошибка, но ng-view не отображается. Если я удалю [] следующим образом (точно, какой тип автора): var app = angular.module («githubViewer»); это ошибка и ссылка на это: https://docs.angularjs.org/error/$injector/unpr?p0=$templateRequestProvider%20%3C-%20$templateRequest%20%3C-%20$route%20% 3C-% 20ngViewDirective –

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