Javascript 加载ajax风格的数据

我开始学习angular.js。你们能告诉我制作一个页面的正确方法吗？这个页面最初显示一个ajax加载程序元素，上面写着“加载数据”之类的内容。然后在获取数据之后，它将更新视图并隐藏元素。我可以使用jquery将内容放在页面加载事件中，但如何使用纯角度？到目前为止，我知道了如何将其放入click事件中：

<div ng-app="VideoStatus" ng-controller="VideoStatusCtrl">
    <button ng-click="getVideos()">get videos</button>
</div>
<script type="text/javascript">
    angular.module('VideoStatus', ['ngResource']).run(function(){ 
       // I guess somehow I can start fetching data from the server here, 
      //  but I don't know how to call Controller methods passing the right scope 
    });

    function VideoStatusCtrl($scope, $resource) {
        $scope.videoStatus = $resource('/Videos/GetStatuses', { callback: 'JSON_CALLBACK' });

        $scope.getVideos = function () {
            $scope.videoResult = $scope.videoStatus.get();
            console.log('videos fetched');
        };
    };
</script>

获取视频
angular.module（'VideoStatus'，['ngResource']）。运行（函数（）{
//我想我可以开始从服务器获取数据了，
//但我不知道如何调用传递正确范围的控制器方法
});
函数VideoStatusCtrl（$scope，$resource）{
$scope.videoStatus=$resource（'/Videos/GetStatuses'，{callback:'JSON_callback'}）；
$scope.getVideos=函数（）{
$scope.videoResult=$scope.videoStatus.get（）；
log（“获取的视频”）；
};
};

这是工作票

这是我的版本，它将加载作为带有模式弹出功能的指令

下面是使用我的版本的教程

您只需要加载.js和modal.js并引用jQuery和twitterbootstrap css

在代码中

您只需要对代码执行两个步骤

将以下代码添加到HTML中