2017-02-09 5 views
0

У меня возникла непредвиденная проблема с моим контроллером, который произошел во время построения 1-го углового проекта, как здесь: https://www.youtube.com/watch?v=8-ZQHv70BCw&t=2119s Проблема заключается в том, что моя ссылка на домашнюю страницу не загружается, она имеет никакого эффекта вообще, даже когда консоль показывает сообщение и не возвращает никаких ошибок. Я тестирую это на plunkr.Контроллер AngularJS работает, но не загружает html-страницу

index.html:

<!DOCTYPE HTML> 
<html lang="en" ng-app="computer"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <title>Computer Solutions</title> 

    <!-- Bootstrap core CSS --> 
    <link href="bootstrap.min.css" rel="stylesheet"> 
    <!-- Custom styles for this template --> 
    <link href="style.css" rel="stylesheet"> 
    </head> 

    <body> 

    <div class="container"> 

     <!-- The justified navigation menu is meant for single line per list item. 
      Multiple lines will require custom code not provided by Bootstrap. --> 
     <div class="masthead"> 
     <h3 class="text-muted">Computer solutions</h3> 
     <nav> 
      <ul class="nav nav-justified"> 
      <li><a href="#/main">Home</a></li> 
      <li><a href="about.html">About</a></li> 
      <li><a href="services.html">Services</a></li> 
      <li><a href="contact.html">Contact</a></li> 
      </ul> 
     </nav> 
     </div> 

<div ng-controller='MainCtrl'> 
    <div ng-view></div> 
</div> 

     <!-- Site footer --> 
     <footer class="footer"> 
     <p>&copy; 2016 Company, Inc.</p> 
     </footer> 

    </div> <!-- /container --> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script> 
<script src="https://code.angularjs.org/1.6.1/angular.js"></script> 
<script src="https://code.angularjs.org/1.6.1/angular-route.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.js"></script> 
<script src="script.js"></script> 
    </body> 
</html> 

script.js

var app = angular.module("computer",['ngRoute']) 


.config(['$routeProvider', function($routeProvider){ 
    $routeProvider. 
    when('/main', { 
    templateUrl: 'main.html', 
    controller: 'MainCtrl' 
}); 

}]) 
.controller('MainCtrl', [function(){ 
    console.log('this is mainctrl'); 
}]); 

и main.html

this is main. 

Заранее спасибо, Михал

+0

У вас есть Plunkr для нас? –

+0

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

+0

У вас есть правильный путь к вашему html-файлу? Например, должно ли оно быть «./main.html» или «../main.html»? – user2085143

ответ

0

Изменен импорт до версии 1.4.8. Версия, которую вы включили, кажется, есть проблемы по $route определению без otherwise:

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

Я также добавил другие государства, и все должны работать.

app.config(['$routeProvider', function($routeProvider) { 
    $routeProvider. 
    when('/main', { 
    templateUrl: 'main.html', 
    controller: 'MainCtrl' 
    }). 
    when('/about', { 
    templateUrl: 'about.html', 
    }). 
    when('/services', { 
    templateUrl: 'services.html', 
    }). 
    when('/contact', { 
    templateUrl: 'contact.html', 
    }) 
}]) 

Смотрите рабочую версию: https://plnkr.co/edit/ebB3GAnoDSunsHK4bpme

+1

Ну, эта версия работает, когда нажимается на Main, но при этом не нажимается на другие ссылки. Странно то, что я сделал то же, что и у, и консоль показывает журналы только при нажатии на Main. Я использую http-сервер на ubuntu, я понятия не имею, где может быть проблема: ( –

+1

Обновление: он работает, я просто забыл перезапустить http-сервер после внесения некоторых незначительных изменений, спасибо вам, сэр, за вашу помощь @ daan.desmedt –

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