Question

我想获取三个获取URI的数据。在表单中，用户输入一个日期，该日期用于使用用户输入的日期从不同的URI中检索三个不同的数据。这怎么都行不通。下面是我编写的当前代码，但它不起作用。简单来说，用户选择一个日期，该日期传递到URI并从API检索数据，这发生在三个函数中，我希望当用户单击fetch时运行所有三个函数。

HTML：

<div style="text-align: center" type="text/ng-template" ng-controller="DailyCtrl" class="users">
          <h1>{{message}}</h1>

<form  style="text-align: center" name="myform" id="myform1" ng-submit="fetch()" >
<input type="date" 
   ng-model="date"  
value="{{ 'date' | date: 'dd/MM/yyyy' }}" />
<div><center><button type="submit" >Fetch</button></center></div>
</form>
{{formdata.date}}
<ul ng-controller="NewCooliosCtrl" ng-repeat="newCoolio in newCoolios.newCoolios">
  <li>{{newCoolio.personID}},  {{newCoolio.placeID}}, {{newCoolio.datePlaced}}</li>
</ul>
 <ul ng-controller="NewPlacesCtrl" ng-repeat="newPlace in newPlaces.newPlaces">
  <li>{{newPlace}} </li>
</ul>
 <ul ng-controller="NewUsersCtrl" ng-repeat="newUser in newUsers.newUsers">
  <li>New Users: {{newUser}} </li>
</ul></br></br>
 </div>

Angularjs：

myApp.config(['$routeProvider',

function ($routeProvider) {
    $routeProvider.when('/getdailydata', {
        templateUrl: 'templates/getnewcoolios.html',
        controller: 'DailyCtrl'
    })
}])
    .controller('DailyCtrl', function ($scope) {
    $scope.toFetch = [];
    $scope.fetch = function () {
        for (var i = 0; i < $scope.toFetch.length; i++) {
            $scope.toFetch[i]();
        }
    }
})
    .controller('NewUsersCtrl', function ($scope, $http, $filter) {
    $scope.fetch = function () {

        var formdata = {
            'date': $filter('date')(this.date, 'dd/MM/yyyy')
        };

        var inserturl = 'http://94.125.132.253:8001/getnewusers?date=' + formdata.date;

        $http.get(inserturl).success(function (data) {
            console.log(formdata);
            $scope.newUsers = data;
            console.log(inserturl);
            console.log(data);
            $scope.message = 'List of New Users';
        })
    }
    $scope.toFetch.push($scope.fetch);
})
    .controller('NewPlacesCtrl', function ($scope, $http, $filter) {

    $scope.fetch = function () {

        var formdata = {
            'date': $filter('date')(this.date, 'dd/MM/yyyy')
        };

        var inserturl = 'http://94.125.132.253:8001/getnewplaces?date=' + formdata.date;

        $http.get(inserturl).success(function (data) {
            console.log(formdata);
            $scope.newPlaces = data;
            console.log(inserturl);
            console.log(data);
            $scope.message = 'List of New places';
        })
    }
    $scope.toFetch.push($scope.fetch);
})
    .controller('NewCooliosCtrl', function ($scope, $http, $filter) {

    $scope.fetch = function () {

        var formdata = {
            'date': $filter('date')(this.date, 'dd/MM/yyyy')
        };

        var inserturl = 'http://94.125.132.253:8001/getnewcoolios?date=' + formdata.date;

        $http.get(inserturl).success(function (data) {
            console.log(formdata);
            $scope.newCoolios = data;
            console.log(inserturl);
            console.log(data);
            $scope.message = 'List of New Coolios';
        })
    }
    $scope.toFetch.push($scope.fetch);
})

Answer 1

这应该是在服务中，正如charlietfl指出的那样 - 但是你能不能简化整个事情并做一些事情（伪代码!!!）：

.controller('DailyCtrl', function ($scope, $filter, $http) {

$scope.newCoolios = [];
$scope.newPlaces = [];
$scope.newUsers = [];
$scope.date; 

$scope.fetch = function(){
    var parsedDate = 'date': $filter('date')(this.date, 'dd/MM/yyyy');

    $http.get('http://94.125.132.253:8001/getnewusers?date=' + parsedData.date).success(function (data) {
        $scope.newUsers = data;
    }); 

    $http.get('http://94.125.132.253:8001/getnewplaces?date=' + parsedData.date).success(function (data) {
        $scope.newPlaces = data;
    }); 

    $http.get('http://94.125.132.253:8001/getnewusers?date=' + parsedData.date).success(function (data) {
        $scope.newUsers = data;
    }); 
}

});

html可能就像....

<div style="text-align: center" type="text/ng-template" ng-controller="DailyCtrl" class="users">
      <h1>{{message}}</h1>
      <input type="date" ng-model="date" value="{{ 'date' | date: 'dd/MM/yyyy' }}" />
      <button ng-click="fetch()">Update</button>
      <ul ng-repeat="newCoolio in newCoolios">
          <li>{{newCoolio.personID}},  {{newCoolio.placeID}}, {{newCoolio.datePlaced}</li>
      </ul>
      <ul ng-repeat="newPlace in newPlaces">
           <li>{{newPlace}} </li>
     </ul>
     <ul ng-repeat="newUser innewUsers">
         <li>New Users: {{newUser}} </li>
     </ul>
 </div>

单击“获取”按钮一次，从三个获取资源中检索数据; angularjs

1 个答案: