Код контроллера AngularJs работает бесконечно

0

поэтому я настраиваю сайт для использования Angular Routing, но я получаю действительно странное поведение. Когда я посещаю маршрут, он, кажется, запускает код в контроллере на неопределенный срок, пока табуляция не завершится. Вот моя маршрутизация:

angular.module(app.appName)
    .config([
        '$routeProvider', function($routeProvider) {
            $routeProvider
                .when('/', {
                    controller: 'homeController',
                    caseInsensitiveMatch: true
                })
                .when('/MyWishlists', {
                    templateUrl: 'assets/html/areas/MyWishlists/myWishlists.html',
                    controller: 'myWishlistsController',
                    caseInsensitiveMatch: true
                })
                .when('/Login', {
                    templateUrl: 'assets/html/areas/login/login.html',
                    controller: 'loginController',
                    caseInsensitiveMatch: true
                })
                .otherwise({ redirectTo: '/' });
        }
    ]);

И вот мой loginController:

angular.module(app.appName)
    .controller('loginController', ['$scope',
        function ($scope) {
            console.log('login');
        }]);

Когда я нахожусь в http://localhost:50925/Login он запустит console.log('login'); снова и снова, пока Chrome не закончит его. Что я здесь делаю, что это вызывает, я никогда не видел этого раньше?

Может быть, это связано с моим конкатенированным файлом? Я использую gulp для объединения всех контроллеров в controllers.js.

Редактирование: я также просто попытался создать новый контроллер, homeController и добавил его к моим маршрутам, и он не использует homeController вообще ни на одном из маршрутов, которые он определил.

angular.module(app.appName)
    .config([
        '$routeProvider', function($routeProvider) {
            $routeProvider
                .when('/', {
                    controller: 'homeController',
                    caseInsensitiveMatch: true
                })
                .when('/Home', {
                    controller: 'homeController',
                    caseInsensitiveMatch: true
                })
                .when('/MyWishlists', {
                    templateUrl: 'assets/html/areas/MyWishlists/myWishlists.html',
                    controller: 'myWishlistsController',
                    caseInsensitiveMatch: true
                })
                .when('/Login', {
                    templateUrl: 'assets/html/areas/login/login.html',
                    controller: 'loginController',
                    caseInsensitiveMatch: true
                })
                .otherwise({ redirectTo: '/' });
        }
    ]);

angular.module('wishlist')
    .controller('homeController', ['$scope',
        function ($scope) {
            console.log('home');
        }]);
Теги:
angular-routing

3 ответа

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

Я решил эту проблему. Проблема для меня в том, что я использую ASP.NET, но я использую метод, который полностью обходит конвейер MVC. Для этого мне нужно было создать Index.cshtml и сообщить приложению, чтобы он обслуживал файл. На данный момент, однако, он возвращает все файлы, которые специально не перечислены в правилах перезаписи web.config как HTML для браузера. Я разрешил доступ к моим ресурсам /js, но не моему HTML, поэтому вместо того, чтобы обслуживать шаблоны HTML с помощью Angular, он извлекал всю перекомпилированную страницу в качестве ответа на браузер, что в свою очередь давало браузеру всю HTML-страницу чтобы сделать новый маршрут, и он застрял, делая это снова и снова, пока браузер не закончит его.

Короче говоря, чтобы решить проблему, мне пришлось добавить ее в мои правила в моем web.config.

<rewrite>
  <rules>
    <rule name="AngularJS Conditions" stopProcessing="true">
      <match url="(wwwroot/.*|assets/min.*|assets/html.*|bower_components/.*|api/.*)" />
      <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
      <action type="None" />
    </rule>
    <rule name="AngularJS Wildcard" enabled="true">
      <match url="(.*)" />
      <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
      <action type="Rewrite" url="index.cshtml" />
    </rule>
  </rules>
</rewrite>
  • 0
    Это имеет смысл. Я столкнулся с той же проблемой при разработке приложения Java Spring MVC. так как web.xml сначала читает и использует отображение URL-адреса пружины, угловая маршрутизация была скрыта им.
0

Похоже, что функция в вашем контроллере имеет имя и некоторые ошибки есть. вы можете это проверить. Вам нужно добавить что-то вроде этого.

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

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

Все остальное выглядит хорошо.

  • 0
    Привет, я настроил app.appName как глобальную app.appName в предыдущем js-файле, если вы это app.appName в виду. Этот подход работал во многих других проектах, но я постараюсь явно указать имя модуля в моем контроллере.
0

Вы должны ввести ngRoute при определении углового модуля. Вот ссылка, которая поможет вам определить ngRoute и надеюсь, что это вам поможет.

  • 0
    Привет, спасибо за ответ. Я уверен, что я ввел ngRoute в свой модуль, но я проверю, когда смогу.
  • 0
    Я ngRoute в мой модуль, здесь: angular.module(app.appName, [ 'ngRoute', 'ngResource' ]);

Ещё вопросы

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