ng-include监听载入完成的3种方式

1. 针对单个引入文件设置属性

<div ng-app="myApp" ng-controller="sitesCtrl">
    <div data-ng-include="inner.html" ="includeInit()"></div><script type="text/javascript">
    var app = angular.module('myApp', []);
    app.controller('sitesCtrl', function($scope) {
        $scope.includeInit = function(){
            $scope.$broadcast('includeInit');
        }
        
        $scope.$on('includeInit',function(){            console.log('include page finish.');
        });
    });</script>

1. 针对单个引入文件设置ng-init事件

<div ng-app="myApp" ng-controller="sitesCtrl">
    <div data-ng-include="inner.html" data-ng-init="includeInit()"></div><script type="text/javascript">
    var app = angular.module('myApp', []);
    app.controller('sitesCtrl', function($scope) {
        $scope.includeInit = function(){             console.log('include page finish.');
        }
    });</script>

1. 通过$rootScope对象监听全局的$includeContentLoaded事件

<div ng-app="myApp" ng-controller="sitesCtrl">
    <div data-ng-include="inner.html"></div><script type="text/javascript">
    var app = angular.module('myApp', []);
    app.run(['$rootScope',function($rootScope){
        $rootScope.$on('$includeContentLoaded',function(){            console.log('include page finish.');
        })
    }]);</script>

作者：梁同学de自言自语
链接：https://www.jianshu.com/p/86211a0dad8c