加载所有部分（ng-includes）后运行一个函数

一旦页面中的所有部分加载，如何运行一行jQuery。 没有运气$（document）.ready和$（document）.load还有其他方法吗？

app.controller('PageCtrl', function () { $(document).ready( function() { $(".left-nav").height( $('.content-area').height()); }); }); 

Answer 1

任何以角度加载的模板，首先它存储在$ templateCache中然后它被使用。 第二次直接从$ templateCache中获取。 最好在应用程序运行块内的应用程序启动时加载所有模板

 //app will be your current app name app.run(['$templateCache','$q','$http', function($templateCache, $q, $http){ var promises = []; promises.push($http.get('partials/views/template1.html',{ cache : $templateCache })); promises.push($http.get('partials/views/template2.html',{ cache : $templateCache })); promises.push($http.get('partials/views/template3.html',{ cache : $templateCache })); $q.all(promises, function (data) { //write code here which want to load after all templates get loaded angular.element(".left-nav").css('height', angular.element('.content-area')[0].offsetHeight); //or if you have jquery file included the try below commented line //angular.element(".left-nav").css('height', angular.element('.content-area')[0].height(); }); }]); 

在angular $ = angular.element中 。

希望这对你有所帮助。

Answer 2

您可以使用控制器。

HTML：

角度：

 app.controller('PageCtrl', function () { $scope.includesLoaded = 0; $scope.totalIncludes = 10; //The total number of includes you have $scope.$watch(function($scope) { return $scope.includesLoaded }, function(newValue, oldValue) { if(newValue === $scope.totalIncludes) { // Your code here } } ); }); app.controller("includeCtrl", ["$timeout", function($timeout) { var init = function() { $timeout(function() { $scope.includesLoaded++; }, 0); }; init(); } ]); 

说明：通过保留变量和已加载的包含数量，您可以判断是否所有这些变量都已加载。 $scope.$watch监听第一个函数中返回的变量的差异，并通过调用第二个函数对其作出反应。 现在， $scope.$watch只会在Angular摘要周期中触发。 $timeout调用循环，但可能不需要，我没有测试代码。 由于PageCtrl必须是应用程序的顶级控制器，因此$ scope.includesLoaded可用于其他控制器，但是，我不确定。 如果它不起作用，请改用$ rootScope。

然而，pankajparkar的回答更好。 只需2美分即可参考。