控制器在AngularJS中调用两次

我在我的代码中使用了角度路由，其中以下代码片段。问题是主控制器被调用两次。我已经注意到不用标记再次声明它（到处都是建议）。我怀疑我的路由代码有问题。 HTML控制器在AngularJS中调用两次

app.directive('routeLoadingIndicator', function ($rootScope,$timeout) { 
return { 
    restrict:'E', 
    link:function(scope, elem, attrs){ 
     scope.isRouteLoading = false; 

     $rootScope.$on('$routeChangeStart', function(){ 
      scope.isRouteLoading = true; 
     }); 
     $rootScope.$on('$routeChangeSuccess', function(){ 
      $timeout(function(){ 
       scope.isRouteLoading = false;      
      }, 10); 
     }); 
    } 
}; 
});

：

控制器

 <route-loading-indicator > 
     <div class="spinner" ng-if='isRouteLoading'> 
      <div class="rectLoader"></div>     
     </div> 
    <div class="right_col" ng-if='!isRouteLoading' style="padding-top: 60px;" ng-view> 
    </div> </route-loading-indicator>

：

app.controller('main', function($scope,$routeParams,$rootScope){ 
    console.log("main Controller"); 
    });

路由代码：

app.config(function($routeProvider) { 
$routeProvider 
    .when("/", { 
     templateUrl : "xyz.html", 
     controller : "main" 
    }) 
    });

来源

2017-01-16 HyperVol

可以重现该问题在拨弄 –

后一个完整的，最小的例子重现问题。包括所有必要的东西，并排除所有不相关的东西（比如你的routeLoadingIndicator）。 –

代码工作正常。检查了这个https://jsfiddle.net/ebinmanuval/c8u34s37/ –

是正确的，因为

<div class="right_col" ng-if='!isRouteLoading' style="padding-top: 60px;" ng-view>

此代码对$ routeChangeStart和$ routeChangeSuccess你togging值路由变化事件因此NG-如果得到所谓的两倍，以及您的

NG-视图

删除NG-如果从纳克视指令可以帮助你......

在我的方式:::你应该显示和隐藏指令.... 去这样的：

<div class="right_col" ng-show='!isRouteLoading' style="padding-top: 60px;" ng-view>

来源

2017-01-16 08:01:28

我不知道为什么，但是这个工作...！ – HyperVol

控制器在AngularJS中调用两次

回答

相关问题