Question

我正在使用Angular JS的pull to refresh插件。但它没有用。我可以看到文字，但是当我试图拉动时，没有任何反应！我完成了此GitHub页面上记录的所有步骤：https://github.com/mgcrea/angular-pull-to-refresh。

我已经包含了所有文件（plugins / pulltorefresh / angular-pull-to-refresh.js，plugins / pulltorefresh / angular-pull-to-refresh.css，plugins / pulltorefresh / angular-pull-to-refresh。项目中的tpl.js，plugins / pulltorefresh / angular-pull-to-refresh.tpl.css）。

你有解决方案吗？

以下是我的controller.js

var phonecatApp = angular.module('phonecatApp', ["ngRoute","ngI18n","phonecatControllers","phonecatservices","LocalStorageModule"]);

phonecatApp.config(['$routeProvider','localStorageServiceProvider',
                function($routeProvider,localStorageServiceProvider) {
                  localStorageServiceProvider.setPrefix('demoPrefix');
                  $routeProvider.
                  when('/pulltorefresh', {
                      templateUrl: 'templates/pulltorefresh.html',
                      controller: 'PullCtrl'
                      }).
                    when('/login', {
                     templateUrl: 'templates/login.html',
                     controller: 'LoginCtrl'
                     }).
                    otherwise({
                      redirectTo: '/pulltorefresh' 
                    });
                }]);
 var phonecatControllers = angular.module('phonecatControllers', ["hammer"]);

 phonecatControllers.controller('PullCtrl', function($scope, $q) {
 $scope.states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California', 'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii', 'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana', 'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota', 'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire', 'New Jersey', 'New Mexico', 'New York', 'North Dakota', 'North Carolina', 'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island', 'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont', 'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'];

 $scope.onReload = function() {
 console.warn('reload');
 var deferred = $q.defer();
 setTimeout(function() {
 deferred.resolve(true);
 }, 1000);
 return deferred.promise;
   };
 });

以下是index.html

<!DOCTYPE html>
<html ng-app="phonecatApp">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no,   width=device-width">
<title>TE</title>
<!-- Bootstrap css -->
<link href="plugins/Bootstrap/bootstrap.css" rel="stylesheet">
<!-- your app's css -->
<link href="css/index.css" rel="stylesheet">
<link href="plugins/pulltorefresh/angular-pull-to-refresh.css" rel="stylesheet">
<link href="plugins/pulltorefresh/style.css" rel="stylesheet">
<!-- angularjs scripts -->
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="plugins/jquery/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="plugins/hammer/hammer.js"></script>
<script type="text/javascript" src="plugins/Bootstrap/bootstrap.min.js"></script>
<script type="text/javascript" src="plugins/angular/angular.js"></script>
<script type="text/javascript" src="plugins/angular/angular-animate.js"></script>
<script type="text/javascript" src="plugins/angular/angular-resource.js"></script>
<script type="text/javascript" src="plugins/angular/angular-sanitize.js"></script>
<script type="text/javascript" src="plugins/angular-ui/angular-ui-router.js"></script>
<script type="text/javascript" src="plugins/angular/angular-route.min.js"></script>
<script type="text/javascript" src="plugins/hammer/angular-hammer.js"></script>
<script type="text/javascript" src="plugins/pulltorefresh/angular-pull-to-refresh.js">        </script>
</head>  

 <body ng-view ng-class="{headerMargin: isHeaderAvailable,footerMargin: isFooterAvailable,datePickeMargin: hasDatePicker}">
  </body>
 </html>

以下是pulltorefresh.html

<div class="content">
 <ul class="list-group list-group-table" pull-to-refresh="onReload()">
    <li class="list-group-item" ng-repeat="state in states" ng-bind="state"></li>
 </ul>
</div>

如果我错过了包含的内容，请告诉我。我是否需要包含任何其他js文件或图像？我不是从https://github.com/mgcrea/angular-pull-to-refresh了解到的。

Answer 1

您似乎忘记了添加指令的关键部分。 Mgcrea具有以下代码行：

angular.module('myapp', ['mgcrea.pullToRefresh']);

您应该将其添加到您的代码中，如下所示：

var phonecatApp = angular.module('phonecatApp', ["ngRoute",
                                                 "ngI18n", 
                                                 "phonecatControllers",      
                                                 "phonecatservices",
                                                 "LocalStorageModule",
                                                 "mgcrea.pullToRefresh"]);

我不确定这是否可以解决您的问题，但这是您似乎没有正确使用的一件事。

在Angular Js中刷新

1 个答案: