In diesem Artikel werden hauptsächlich zwei Methoden für AngularJS zur Überwachung des Abschlusses des NG-Repeat-Renderings vorgestellt und die zugehörigen Betriebstechniken von AngularJS anhand benutzerdefinierter Anweisungen und Broadcast-Ereignisse analysiert, um die Überwachungsfunktion anhand von Beispielen zu implementieren dazu
Die Beispiele in diesem Artikel beschreiben zwei Methoden für AngularJS, um den Abschluss des ng-repeat-Renderings zu überwachen. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
Es gibt zwei Methoden, um den Abschluss des NG-Repeat-Renderings zu überwachen
1. Die praktischste Methode:
<ul class="pprt_content">
<li ng-repeat="src in imageHotList track by $index" ng-click='goGoodsDet(src.goodsId,src.merchId)' on-finish-render-filters="completeRepeat">
<img ng-src="{{productUrl}}{{src.imageName}}">
</li>
</ul>Entsprechender Scope-Controller:
$scope.completeRepeate= function(){
alert('1')
}Benutzerdefinierte Anweisungsanweisung:
var app = angular.moduler('myApp',[]);
app.directive('onFinishRenderFilters', ['$timeout', function ($timeout) {
return {
restrict: 'A',
link: function(scope,element,attr) {
if (scope.$last === true) {
var finishFunc=scope.$parent[attr.onFinishRenderFilters];
if(finishFunc)
{
finishFunc();
}
}
}
};
}])2. Broadcast-Ereignisse verwenden
/*
* Controller文件中的代码
* Setup general page controller
*/
MetronicApp.controller('simpleManageController', ['$rootScope',
'$scope', 'settings','$http', function($rootScope, $scope, settings,$http) {
$scope.$on('ngRepeatFinished', function (ngRepeatFinishedEvent) {
//下面是在table render完成后执行的js
FormEditable.init();
Metronic.stopPageLoading();
$(".simpleTab").show();
});
});
MetronicApp.directive('onFinishRenderFilters', function ($timeout) {
return {
restrict: 'A',
link: function(scope,element,attr) {
if (scope.$last === true) {
$timeout(function() {
scope.$emit('ngRepeatFinished');
});
}
}
};
});HTML
<!--HTML页面的代码，添加标签onFinishRenderFilters(格式有变)：on-finish-render-filters-->
<tr style="display: none" class="simpleTab" ng-repeat="simpleProduct in simpleProducts"
on-finish-render-filters>
<td>
{{simpleProduct.productNo}}
</td>
</tr>Das oben Gesagte habe ich für Sie zusammengestellt. Ich hoffe, es wird Ihnen in Zukunft hilfreich sein.
Verwandte Artikel:
Wie verwende ich die globale Eingabeaufforderungsbox-Komponente in Vue?
So verwenden Sie die ElementRef-Anwendung in Angular4
So verwenden Sie CLI-Anfrage-Proxy und Probleme bei der Projektverpackung in Vue
Bus Global Event Center in Vue (ausführliches Tutorial)
Das obige ist der detaillierte Inhalt vonProbleme im Zusammenhang mit dem Abhören des ng-repeat-Renderings in AngularJS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
