AngularJS - 如何从GET方法获取数据

-3

angular.module('apartmentCtrl', []) 

.controller('ApartmentController', function ($scope, $http, Apartment) { 
    $scope.loading = true; 

    $scope.myLocation = ''; 

    Apartment.get($scope.myLocation).success(function (data) { 
     $scope.apartments = data; 
     $scope.loading = false; 
    }); 
});

我的服务 angular.module（ 'apartmentService'，[]）

.factory('Apartment', function ($http) { 
    return { 
     get: function (myLocation) { 
      //return $http.get('/api/apartments'); 
      return $http({ 
       method: 'GET', 
       url: '/api/apartments', 
       //headers: {'Content-Type': 'application/x-www-form-urlencoded'}, 
       params: {location: myLocation} 
      }); 
     } 
    }; 
});

我的HTML：

<input type="text" name="myLocation" class="form-control" ng-model="myLocation">

如何从AngularJS的GET方法获取数据并将其传递给params

来源

2015-02-10 Joshua Hansen

请出示你的代码。你使用Angular提交表单吗？ – 2015-02-10 02:20:08

你可以使用'$ http'来做到这一点。 http://www.w3schools.com/angular/angular_http.asp – 2015-02-10 02:32:05

你必须在控制器中使用'$ http'服务。请显示您的代码 – nosthertus 2015-02-10 02:32:58

如果你想从窗体传递一些值作为“位置”，你应该将它绑定到你的模型，并明确地将它传递给你的工厂get函数。

我在这里有一个工作示例，它只是一个窗口提示，显示您输入的数据，而不是$ http调用，但想法是相同的。

http://plnkr.co/edit/fRra6RfQrSZb8rzrm4XF?p=preview

HTML：

<!DOCTYPE html> 
<html ng-app="plunker"> 

    <head> 
    <meta charset="utf-8" /> 
    <title>AngularJS Plunker</title> 
    <script>document.write('<base href="' + document.location + '" />');</script> 
    <link rel="stylesheet" href="style.css" /> 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.2.28/angular.js" data-semver="1.2.28"></script> 
    <script src="app.js"></script> 
    </head> 

    <body ng-controller="MainCtrl"> 
    <p>Hello {{name}}!</p> 

    <form ng-submit="getIt()"> 
     <input type="text" ng-model="myLocation"/> 
     <input type="submit"/> 
    </form> 

    </body> 

</html>

的Javascript：

var app = angular.module('plunker', []); 

app.controller('MainCtrl', function($scope, Apartment) { 
    $scope.name = 'World'; 
    $scope.myLocation = 'Hollywood'; 

    $scope.getIt = function() { 
    Apartment.get($scope.myLocation); 
    } 
}); 

app.factory('Apartment', function ($window) { 
     return { 
      get: function (whatLocation) { 
       $window.alert(whatLocation); 
      } 
     }; 
    });

来源

2015-02-10 04:30:14

我无法获得'myLocation'的价值:( – 2015-02-10 04:55:54

谢谢。它有效。但我有一个新问题。假设我有一个URL：'http://myproject.com/apartments?location=&arrival=1/15/2015＆departure = 2/1/2015＆room = 1'。我提交时如何获取参数'arrival'，'departure'，'room'并将它们附加到表单数据中。 – 2015-02-10 15:40:38

完全一样，通过所有你需要的参数以及你的$ http将它们添加到你发送的参数中，所以你的公寓获取函数可能看起来像：'get：function（myLocation，arrival，departure，room）...'，在这种方法中， d打电话给你的web服务：'params：{location：myLocation，arrival：arrival，departure：departure，rooms：rooms}' – 2015-02-10 16:54:15

AngularJS - 如何从GET方法获取数据

回答

相关问题