Маршрутизация работает для всех, кроме одной страницы

0

Я вытягиваю свои волосы из-за этого - я работаю над настройкой маршрутизации для SPA, и он работает потрясающе для main страницы и моей страницы search. Однако он не работает вообще для моей страницы services, он просто ничего не отображает. Мой URL-адрес настроен правильно, и страница определенно находится на страницах /services.html.. Что дает?

Опять же, он отлично работает для маршрутов '/' и '/searchquery', но не '/servicedependencies'

Вот мои файлы:

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

impact_analysis.config(['$routeProvider', function($routeProvider) {
      $routeProvider
            .when('/', {
                  templateUrl: 'pages/main.html',
                  controller: 'mainController'
            })
            .when('/servicedependencies', {
                  templateURL: 'pages/services.html',
                  controller: 'serviceController'
            })
            .when('/searchquery', {
                  templateUrl: 'pages/search.html',
                  controller: 'mainController'
            });

}]);

impact_analysis.controller('mainController', ['$scope', '$http', function ($scope, $http) {

      $scope.search_string = '';
      $scope.search_type = '';
      $scope.results = [];
      $scope.clicked = 0;
      $scope.search = function() {
            var request = {
                  method: 'POST',
                  url: *********,
                  data: JSON.stringify({search_string: $scope.search_string, search_type: $scope.search_type}),
                  headers: {'Content-Type': 'application/json'}
            };

            $http(request).then(function(response) {
                  $scope.results=response.data;
                  $scope.clicked = 1;
            });

      };
}]);

impact_analysis.controller('serviceController', ['$scope', '$http', function ($scope, $http) {
      $scope.clicked = 0;
      $scope.results = [];
      $scope.service_report = function () {
            var request = {
                  method: 'GET',
                  url: **************,
            };

            $http(request).then(function(response) {
                  $scope.clicked = 1;
                  $scope.results=response.data;
            });

      };
}]);
<!DOCTYPE html>
<html>
<head>
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
      <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
      <link href="index.css" rel="stylesheet">
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.2/angular.min.js"></script>
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.2/angular-route.min.js"></script>
      <script src="app.js"></script>
</head>
<body ng-app="impact_analysis">
      <!-- START TOP NAVBAR -->
      <header>
            <nav class="navbar navbar-default">
                  <div class="container-fluid">
                        <div class="navbar-header">
                              <a class="navbar-brand" style="color:#B9A3E3" href="index.html">Message Broker Impact Analysis</a>
                        </div>
                        <ul class="nav navbar-nav navbar-right">
                              <li><a class="fa fa-home bigicon" href="#/"></a></li>
                        </ul>
                        <ul class="nav navbar-nav navbar-right">
                              <li><a href="#/searchquery">Search String Query</a></li>
                        </ul>
                        <ul class="nav navbar-nav navbar-right">
                              <li><a href="#/servicedependencies">Service Dependency Report</a></li>
                        </ul>
                  </div>
            </nav>
      </header>
      <!-- END TOP NAVBAR -->

      <div class="container-fluid">
            <div ng-view></div>
      </div>
</body>
</html>

<div class="row">
      <div class="col-md-12">
            <div class="page-header">
                  <h2>Service Dependency Report</h2>
            </div>
            <button type="button" class="btn btn-warning btn-lg" ng-click="service_report()">Generate</button>
            <table class="table-striped table-bordered table-hover" ng-show="results.length != 0" >
                  <thead>
                        <tr>
                              <th>Flow</th>
                              <th>Service Dependencies</th>
                        </tr>
                  </thead>
                  <tr ng-repeat="msgflow in results">
                        <td style="font-size: 1.5em">{{ msgflow.name }}</td>
                        <td ng-repeat="service in msgflow.services">{{ service }}</td>
                  </tr>
            </table>
      </div>
</div>
  • 0
    есть ли ошибки на странице?
  • 0
    Нет, я смотрел на консоль и там ничего нет. На вкладке Сеть, если вы нажимаете мои ссылки, она показывает, что она загружает <IP>/pages/search.html и <IP>/pages/main.html , но когда вы щелкаете по неисправной, она ничего не показывает. Должен отображаться <IP>/pages/services.html
Показать ещё 2 комментария
Теги:

1 ответ

5
Лучший ответ

У вас есть опечатка? Попробуйте шаблон url вместо URL шаблона

.when('/servicedependencies', {
         templateUrl: 'pages/services.html',
         controller: 'serviceController'
    })
Поделиться
  • 0
    Проклятье.....
  • 1
    Да, ты первый, кто это сделал;)
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню