AngularJs: контроллер вызывается дважды, используя $routeProvider

Маршруты модулей:

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

switchModule.config(['$routeProvider', function($routeProvider) {
    $routeProvider.
    when('/build-content', {templateUrl: 'build-content.html', controller: BuildInfoController});
}]);

Контроллер:

function BuildInfoController($http, $scope){
    alert("hello");
}

Html:

<html ng-app="switchModule">
...
<body>
    <ul>
        <li><a href="#build-content"/></a></li>
    </ul>
    <div class="ng-view"></div>
</body>
...

Каждый раз, когда я нажимаю гиперссылку '', 'BuildInfoController' будет вызываться дважды. Я что-то пропустил?

Ответы

Ответ 1

У меня была такая же проблема, и, похоже, есть глупая ошибка с маршрутизацией. Существует некоторая переадресация.

чтобы исправить это, я просто добавил косую черту в href, например:

<li><a href="#/build-content/"></a></li>

Я надеюсь, что это тоже поможет вам.

Ответ 2

Сегодня у меня была такая же проблема. Я добавил имя контроллера в мой $routeProvider, а также в свой html.

$routeProvider
    .when('/login', {
            controller: 'LoginController',
            templateUrl: 'html/views/log-in.html'
     })

и, на мой взгляд,

<div class="personalDetails" ng-controller="LoginController"> </div>

Вы можете удалить имя контроллера либо из своего вида, либо из вашего маршрутизатора.

Ответ 3

У меня была аналогичная проблема. Я нашел добавление конечной косой черты на маршруте, но не в ссылке работал как ожидалось.

$routeProvider.
when('/build-content/',...);

С этой разметкой

<li><a href="/build-content">Content</a></li>

И затем AngularJS исправит URL-адрес браузера в том, что определено в $routeProvider.

Как ни странно, противоположность, похоже, тоже работает с конечной косой чертой в ссылке, а не на маршруте. Кажется, что конечные косые черты не соответствуют разрешению, и контроллер не будет вызываться дважды!

Ответ 4

Шахта была примером двух директив. Я попытался обернуть его, но непреднамеренно его дублировал:

<div class="ng-view">
    <div ng-view></div>
</div>

Удалена оболочка, исправлена ​​ее.

Ответ 5

Удалите директиву ng-controller со страниц вашего шаблона, если она существует.

Ответ 6

У меня была такая же проблема, и я обнаружил, что если вы загрузили вас angular два раза, вы можете иметь такую ​​же ошибку.

В моем случае я имел <body ng-app>, но также angular.bootstrap(document,['app']) и вызвал двойную инициализацию контроллеров.

Надеюсь, что это может сэкономить некоторое время кому-то.

Ответ 7

У меня было объявление SomeController для каждого представления, частичного в одном состоянии. Это вызвало дублирование событий.

 .state('chat', {
            url: '/',
            views: {
                '[email protected]': {
                    templateUrl: 'views/chat_wv1.html',
                    controller: 'ChatController'
                },
                '[email protected]': {
                    templateUrl: 'views/chat_wv_placeholder.html',
                    controller: 'ViewController'
                },
                '[email protected]': {
                     templateUrl: 'views/sidePanel_wv.html'
                     /* removing this part solved my issue*/
                     /*controller: 'ChatController'*/
                }

            }
        })

Надеюсь, это поможет кому-то еще.

Ответ 8

У меня тоже была аналогичная проблема с customDirective и индивидуально дублированным моим контроллером.

<html>
   <body ng-app="MyApp" ng-controller="MyDirectiveCtrl">
      <my-directive></my-directive>
   </body>
</html>

angular.directive('myDirectivie', [function() {
   return {
         restrict: 'E',
         controller: 'MyDirectiveCtrl',

         ...

   }
}]);

Я разрешил его, удалив тег ng-controller на уровне тела

Ответ 9

потому что у вас есть несколько ui-view

Ответ 10

Контроллер может быть добавлен к нескольким элементам DOM, поэтому эта проблема может возникнуть, если это было сделано, например.

  <div id="myDiv1" ng-controller="myController" ....></div>
  ....
  <div id="myDiv2" ng-controller="myController" ....></div>

Ответ 11

То же самое здесь Мое было случаем наличия директив 2 нг-зрения.

   enter code here Удалено дублирующее, т.е. Ng-view, исправлено.