Шаблон не поступил в Угловой маршрут

Проблема довольно проста. Я пробовал уже несколько часов, но просто не мог получить шаблон для загрузки через маршрутизацию на стороне клиента angularJS. Не использовать маршрутизацию на стороне сервера.Шаблон не поступил в Угловой маршрут

Таким образом, используются различные комбинации путей. Если я использую «/ home» в кнопке href, он сразу же дает ошибку, чтобы он не мог найти «/ home». Но с «#/home» я не получаю эту ошибку, но она все равно не загрузит шаблон.

Любая помощь была бы принята с благодарностью.

Создано новый plunker: http://plnkr.co/edit/F7KoWbBuwsXOQLRPF0CN?p=preview

каталог Шаблон:

Project --- 
      | 
      | 
      CSS 
      | 
      | 
      JS 
      | 
      | 
     templates--- 
        | 
        | 
       home.html

JS:

var myApp = angular.module("myApp",['ngRoute']); 


myApp.controller('appController',function($scope,$http){ 
//mytext = 0; instantiating variables without using var gives referencing error due to "use strict"; 
     $scope.angular = angular; 
     $scope.mytext = "Harsh"; 
     $scope.formSuccess = false; 


    $http({method:"GET", url:"JS/carousel-data.json"}). 
    success(function(data) { 
    $scope.carouselData = angular.fromJson(data); 
    }). 
    error(function(data) { 
     console.log("Error loading images"); 
    }); 

myApp.config(function($routeProvider, $locationProvider) { 

    $routeProvider 
    .when('/home', { 
    templateUrl: 'templates/home.html', 
    controller: 'appController' 
    }) 
    .when('/edit', { 
    templateUrl: 'templates/home.html', 
    controller: 'appController' 
    }); 

});

HTML:

<body ng-controller="appController"> 
    <header id="pageHeader" class="col-md-12 col-sm-12 col-xs-12 header"> 


       <nav class="col-md-5 col-sm-6 col-xs-10 menu"> 
        <ul class="nav nav-pills" id="menuLinks"> 

         <li class="dropdown visible-xs"> 
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Sapient <span class="caret"></span></a> 
          <ul class="dropdown-menu" role="menu"> 
          <li><a href="#/home">Home</a></li> 
          <li><a href="#/edit">Edit</a></li> 
          </ul> 
         </li> 

         <li role="presentation" class="hidden-xs" ><a href="#/home">Home</a></li> 
         <li role="presentation" class="hidden-xs" ><a href="#/edit">Edit</a></li> 
        </ul> 

       </nav> 

      </header> 

<div ng-view></div> 

</body>

источник

2015-06-17 AngularHarsh

Я вижу несколько ошибок в вашем коде, было бы полезно, если бы вы могли добавить ошибки, которые вы видите на консоли (если вы используете Google Chrome, щелкните правой кнопкой мыши на любой части страницы, проверьте элемент, затем перейдите вкладка «Консоль»). Там вы можете найти более подробную информацию об ошибке, которая была создана, может быть просто проблемой пути или чем-то другим. – peppeocchi

На самом деле я не вижу ошибок в консоли. – AngularHarsh

Оформить заказ. Создал новый плункер для проблемы. – AngularHarsh

Это довольно неясно, как вы установили вверх вещи? Является ли HTML вашим индексом или является вашим home.html?

Во-вторых, вы уже объявляете контроллеры ваших страниц appController, нет необходимости определять это с помощью директивы ng-controller.

Кроме того, вы загружаете один и тот же шаблон на каждый href, может быть, вы просто видите ту же страницу, что и объявили?

$routeProvider 
    .when('/home', { 
    templateUrl: 'templates/home.html', <--- 
    controller: 'appController' <--- 
    }) 
    .when('/edit', { 
    templateUrl: 'templates/home.html', <--- 
    controller: '**appController'<-- 
    });

Следует отметить, что существует более обширный модуль для маршрутизации. Вы можете найти его на ui-router.

источник

2015-06-17 13:27:41 skubski

1) Я просто делаю простую маршрутизацию как POC, поэтому я хочу загрузить home.html при щелчке какого-либо якорного тега, который указывает на/Главная. 2) Пренебрегайте контроллером и отредактируйте часть. Это просто фиктивный контроллер. Главное, что я хочу перенаправить home.html в ng-view при щелчке тега привязки. – AngularHarsh

Оформить заказ. Создал новый плункер для проблемы. – AngularHarsh

Спасибо за попытку. Но это работает в plunker, но не в моей системе. Я бы посоветовал вам попробовать. – AngularHarsh

Шаблон не поступил в Угловой маршрут

ответ

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