angularjsルートでdocument.readyを実行

Question

anglejsのルートを使用してMaterializeフレームワークから.parallax（）関数を実行しようとしています。私はすでに各テンプレートに対してdocument.readyコマンドを設定していますが、これは機能しません。これはちょうど初めて動作します。 document.readyを$（ 'test'）のような関数を呼び出す最良の方法は何ですか。ルートを使用して？待ちます！ありがとう！私のルートの

テンプレートHTML：

<!-- JS --> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('.parallax').parallax(); //Run just in the first time 
    }; 
</script> 

<!-- Template --> 
<div class="" ng-controller="homeCtrl"> 
... 
</div> 

コントローラー：

app.controller('homeCtrl', ['$scope', function($scope){ 

    //Ready 
    angular.element(document).ready(function() { 
     $('.parallax').parallax(); // Doesn't work 
    }); 

}]); 

ありがとう！

Answer 1

明らかに、これは単一ページのアプリケーションであり、コントローラがロードされる前にドキュメントが既にロードされており、スクリプトタグ内のコールバックが呼び出されるため、コントローラのコードは機能しません。私はあなたのparallexクラス要素がルートの各ビューに存在していると仮定すると、のようなもの

App.directive('testJquery', function() { 
return { 
    restrict: 'A', 
    link: function(scope, element, attrs) { 
     $(element).parallex(); 
    } 
    }; 
}); 

とhtmlのようなディレクティブを作成することができると思い

<div class="parallex" test-plugin><div> 

外で1つのdiv要素がある場合あなたはメイン・コントローラー（この要素がそこにある）で何ができるのかをルートを変更するたびにparallexまたは任意のtestFuntionを要素にコールしたいとします。

ディレクティブを

に変更します

App.directive('testJquery', function() { 
return { 
    restrict: 'A', 
    scope:{ 
     runFunctionAgain:'=' 
    }, 
    link: function(scope, element, attrs) { 
     $(element).parallex(); 
     scope.$watch('runFunctionAgain', function(){ 
      if(scope.runFunctionAgain){ 
       $(element).parallex(); 
       scope.runFunctionAgain = false; 
      } 
     }) 
    } 
    }; 
}); 

そして、私はマテリアライズのCSSを使用しています

scope.runFunctionAgain = true; 
$scope.$on('$routeChangeStart', function (event, next, current) { 
    scope.runFunctionAgain = true; 
});