How to modify view with $scope variable in another Controller?

ionic-v1
1

Hey !
I try to modify my view with change my variable value from another controller, but it’s not working …

I want to display my content only after css animation is endend.
here is my code:

.controller('AppCtrl', function($scope, $rootScope, $state, $ionicPopup, AuthService, AUTH_EVENTS) {
$scope.showLoader = function(){
    var loader = document.getElementById("loader");
    loader.style.zIndex = "9";
    loader.style.opacity = "1";
    var loading = loader.getElementsByClassName("loading")[0];
    loading.className = "loading animated bounceInDown";
  }
  
  $scope.hideLoader = function(){
    var loader = document.getElementById("loader");
    var loading = loader.getElementsByClassName("loading")[0];
    angular.element(document.querySelector('#loader .loading')).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
      loading.className = "loading animated bounceOutDown";
      angular.element(document.querySelector('#loader .loading')).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(){
        loader.style.zIndex = "-1";
        loader.style.opacity = "0";
        $rootScope.$apply(function () {
          $rootScope.renderContent = true;
        });
      });
    });
  }
}

.controller('CommentsCtrl', function($scope, $rootScope, $state, $http, $ionicPopup, AuthService, WebServices, $stateParams) {
  $scope.renderContent = false;
  $scope.showLoader();
  $scope.hideLoader();
}

And the view:

<ion-view view-title="Waiting comments"  name="dashboard-view">
  <ion-content has-header="true">
    <div ng-show="renderContent">
      <ion-list>
       Animation finished!
      </ion-list>
    </div>
  </ion-content>
</ion-view>

Someone cane helps me?