控制器在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中調用兩次

回答

相關問題