6

AngularJS を使用して jquery プラグイン MixItUp をセットアップしています。NgRoute を使用した部分ビューの 1 つでコンテナーを正常に開始できますが、他のページ ビューに移動して戻ると、MixItUp がセットアップを開始する方法を認識していないようです。また。

$(document).ready()、$(window).load、さらには $viewContentLoaded を試しましたが、何も動作しないようです。他のページをクリックして再度戻っても、コンテナ全体が呼び出されません。

以下のような私のコード。

$scope.$on('$viewContentLoaded', function(){  

    $('#container').mixItUp();    

    var $container = $('#ContainerP');

    if(!$container.mixItUp('isLoaded')){
      $container.mixItUp();
    } 
  alert("It's loading!");
});

アラート メッセージを含め、関数内のすべてがスムーズに通過しますが、どういうわけか、私のルーティング ビュー内で mixItUp を呼び出すことができません。ありがとう！

4

4 に答える 4

0

私は数時間を費やし、最終的に解決策がここにあります....

if ($('#grid').mixItUp('isLoaded')) {
          $('#grid').mixItUp('destroy');
          $('#grid').mixItUp();
      } else {
        $('#grid').mixItUp();
      }

完全なディレクティブ コードは次のとおりです。

'use strict';
 angular.module('rjApp')
.directive('mixitup',function($timeout,$compile){
  var linker = function(scope,element,attr) {

    scope.$watch('entities', function(newVal, oldVal){

      $timeout(function(){
        if ($('#grid').mixItUp('isLoaded')) {
            $('#grid').mixItUp('destroy');
            $('#grid').mixItUp();
        } else {
          $('#grid').mixItUp();
        }
      },10);
    },true);

  };
  return {
    link: linker,
    scope:{entities:'='}
  }
})
于 2016-04-04T20:49:18.440 に答える
0

DOM を使用する場合は、ディレクティブを使用することをお勧めします。そのため、MixItUp を開始するディレクティブを作成する必要があります。

angular.module('app').directive('myNgMixitup', [function(){
   return {
      restrict: 'AEC',
      link: function(scope, element){
         //now you can access the element/container
         element.mixItUp();
      }
   };
}])
于 2015-10-19T08:55:40.220 に答える