angular 的下拉加载

最新推荐文章于 2019-09-01 17:04:35 发布

-久了久了就旧了

最新推荐文章于 2019-09-01 17:04:35 发布

阅读量441

点赞数

本文链接：https://blog.csdn.net/xiaozhang0414/article/details/78832097

版权

angular代码专栏收录该内容

15 篇文章 0 订阅

订阅专栏

这里写图片描述

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <link rel="stylesheet" type="text/css" href="css/ionic.css" />
        <script src="js/ionic.bundle.min.js"></script>
    </head>
    <!--
                下拉刷新的控件
                ion-refresher
                pulling-text  显示的问题，提示
                pulling-icon  图标
                on-refresh    刷新时候的回调方法
                    请求网络，加载数据
            -->

    <body ng-app="myapp" ng-controller="myctl">
        <!--
            头部
        -->
        <ion-header-bar class="bar-calm">
            <h1 class="title">加载更多</h1>

        </ion-header-bar>
        <ion-content>
            <!--//刷新控件-->
            <ion-refresher pulling-text="刷新..." on-refresh="shauxin()">

            </ion-refresher>
            <!--加载条目-->
            <ul class="list">
                <li class="item" ng-repeat="n in names">{{n}}</li>
            </ul>

        </ion-content>

    </body>
    <script type="text/javascript">
        var mo = angular.module("myapp", ["ionic"])
        mo.controller("myctl", function($scope, $http) {
//          $http 是 AngularJS 中的一个核心服务，用于读取远程服务器的数据。
            $scope.names = ["杨过", "胡一刀"];
            //刷新的方法
            $scope.shauxin = function() {
                 //data/data1.json 路径
                $http.get("data/data1.json").then(function(req) {

                    //接收数据   data 是req里面的一个常量
                    var name1 = req.data;
                    // alert(name1.length+"++++++++++++");
                    $scope.names.push("温柔")
                    for(var i = 0; i < name1.length; i++) {

                        $scope.names.push(name1[i].name)

                    }
                    //发送广播 //加载完成关闭刷新
                    $scope.$broadcast('scroll.refreshComplete');
                }, function(req) {
                    console.log("shibai---")
                }).finally(function() {
                    console.log("finally---")
                })
            }
        })
    </script>

</html>

-久了久了就旧了

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
angular 的下拉加载

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" type="text/css" href="css/ionic.css" /> <script src="js/ionic.bundle.min.j
复制链接

扫一扫