2017-01-26 2 views
-1

Я создаю веб-сайт, и я использую JavaScript + AngularJS, в настоящее время я создаю маршруты для приложения, но он всегда возвращает 404, не найденный на сервере, я пробовал несколько примеров Интернета, но ни один из них работал, вот пример моего кода, помня, что HTML-страницы внутри WebContent:Как создать маршруты в AngularJS + JavaScript?

<html ng-app="angularRoutingApp"> 
<head> 
    <title>Home</title> 
    <meta charset="utf-8"> 
</head> 
<body> 
    <div> 
     <a href="/index">index</a> <br> <a href="/">home</a> 
    </div> 
    <div ng-view></div> 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> 
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.3/angular-route.js"></script> 
    <script> 
    var angularRoutingApp = angular.module('angularRoutingApp', ['ngRoute']); 

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

     $locationProvider.html5Mode(true); 

     $routeProvider 
      .when("/index", { 
       template: "/index.html" 
      }) 
      .otherwise({ 
       redirectTo: '/home.html' 
      }); 
    }); 
    </script> 
</body> 
</html> 
+1

Где элемент '' ? – Laazo

+0

На самом деле тег ng-view не был определен, но теперь я его написал, но все еще даю 404, не найден, это изменение –

+0

Я бы предложил следующее учебное пособие вместо того, чтобы пытаться случайный код, который вы (по-видимому) скопировали и вставили в интернет – zerohero

ответ

0

вы забыли директиву нг вида.

также

  • HREF нужно быть с хэш-приставкой - или с помощью директивы Link.
  • необходимости ключа RedirectTo, чтобы обеспечить представление [имя/адрес] & не шаблона
  • , если вы хотите использовать файлы шаблонов & не встроенный код использует templateUrl ключа

вы можете увидеть пример ваш код здесь: http://codepen.io/AceDesigns/pen/ZLXLKa

<html ng-app="angularRoutingApp"> 
    <head> 
    <title>Home</title> 
    <meta charset="utf-8"> 
    </head> 
    <body> 
    <div> 
     <a href="#/index">index</a><br> 
     <a href="#/">home</a> 
    </div> 
    <div class=""> 
     <ng-view></ng-view> 
    </div> 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> 
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.3/angular-route.js"></script> 
    <script> 
     var angularRoutingApp = angular.module('angularRoutingApp', ['ngRoute']); 
     angularRoutingApp.config(function($routeProvider){ 
     $routeProvider 
      .when("/index", {template:"<div>INDEX VIEW</div>"}) 
      .when("/home", {template:"<div>HOME VIEW</div>"}) 
     .when("/tempFile", {templateUrl: "views/temp_file.html"}) 
      .otherwise({redirectTo: '/home'}); 
     }); 
    </script> 
    </body> 
</html> 
+0

Спасибо, это сработало. –

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