Angularjs消化周期锁定滚动

下午好球员，Angularjs消化周期锁定滚动

，我有以下问题，我有一个引用四个部分HTML中的同一个屏幕上的导航选项卡。这些部分根据活动选项卡获得显示块或显示无，每个选项卡都有不同的内容，通过ajax已经在后台加载，直到ai一切正常，问题是当我在选项卡之间导航时，有不同大小的框高度，显然Angularjs的消化周期需要承认这个调整大小，页面的滚动被锁定，直到它检测到新的高度，有人对我如何着手解决这个问题有任何想法，我正在使用IONIC FRAMEWORK。

下面是显示内容框如何，记住，只有一个是可见的，在一个时间内进行拍摄，当我看着网页我注意到锁定在style =" transform: translate3d (0px, 0px, 0px) Scale (1);

来源

2016-12-06 1fabiopereira

发生

经过几次尝试之后，我将这个bug留在一边，转到其他函数，并且在控制标签的指令中进行更正时，我注意到一旦加载了新标签，我就可以重新计算滚动大小。添加以下行单击函数：

$ionicScrollDelegate.resize(); //Fix box resize bug when trasition between tabs

功能去如此：

$timeout(function() { 
    childElem = angular.element(document.querySelector(".child")).prop('children'); 
    if(childElem.length){ 
     for (var i = 0; i < childElem.length; i++) { 
     angular.element(childElem[i]).on('click', function (e) { 
      var tab = angular.element(e.path ? e.path[0] : e.target).prop('id').replace(/tab/g, ""); 
      $rootScope.$emit('aba_ativa_feed', tab); // informa a view feed qual a aba ativa 
      for (var i = 0; i < tabs.length; i++) { 
      if(i == tab - 1) { 
       ativos[i] = true; 
      } else { 
       ativos[i] = false; 
       angular.element(document.querySelector("#tab-nav-block-id-".concat(i+1))).addClass('ng-hide'); 
      } 
      } 
      angular.element(document.querySelector("#tab-nav-block-id-".concat(tab))).removeClass('ng-hide'); 
      $ionicScrollDelegate.scrollTo(0, blocksScrollPosition[tab - 1], true); 
      scope.active = ativos; 
      scope.$apply(); 
      $ionicScrollDelegate.resize(); //Fix box resize bug when trasition between tabs 
     }) 
     } 
    } 
    }, 200)

更多细节看here

来源

2016-12-20 11:22:27 1fabiopereira

Angularjs消化周期锁定滚动

回答

相关问题