angularjs加载视图时获取URL

时间:2016-10-18 14:18:31

标签: javascript angularjs

在加载我的一个视图时尝试进行API调用。

controllers.controller("detailsCtrl", ["$scope", "$routeParams", "$filter", "$http", function($scope, $routeParams, $filter, $http) {

  $scope.getCurrent = function(url, id, callBack, apiCall, promise) {
    var url = "api.openweathermap.org/data/2.5/weather?id=2172797";
    var id = "&appid=d436c04d23a5a44329eb8255190a84be";
    var callBack = "&callback=JSON_CALLBACK";
    var apiCall = url += id += callBack;
    var promise = $http.jsonp(apiCall);
    promise.success(function(response) {
      $scope.current = response.current;
      console.log($scope.current);
    });
  };

  $scope.cityName = $filter("filter")($scope.data.list, {
    id: $routeParams.cityId
  })[0];

}]);

在html中使用ng-init

      <div ng-controller="detailsCtrl" ng-init="getCurrent()">
    <h1>{{ cityName.name }}</h1>
      <tr>
        <td>lat: {{cityName.coord.lat}}, lon: {{cityName.coord.lon}}</td>
        <td>{{}}</td>
        <td>{{}}</td>
        <td>{{}}</td>
        <td>{{}}</td>
        <td>Clouds: {{cityName.clouds.all}}</td>
        <td>{{}}</td>
        <td>{{}}</td>
      </tr>

  </div>

继续获取:http://localhost:8080/api.openweathermap.org/data/2.5/weather?id=2172797&appid=d436c04d23a5a44329eb8255190a84be&callback=angular.callbacks._1,任何想法为什么?

note 在用户导航到详细视图之前,还在我的主视图中进行另一个API调用。当用户切换视图时尝试点击,但它根本没有拨打电话。

2 个答案:

答案 0 :(得分:2)

请更改网址,如下所示

var url = "http://api.openweathermap.org/data/2.5/weather?id=2172797";

因为你无法找到网址。 在您的通话中,它会使网址从当前网址追加。

答案 1 :(得分:2)

我使用angular2而不是angularjs,但相信你的问题与不正确的http请求更相关。我刚用plunkr制作了你的样本:http://plnkr.co/edit/rOZOyAcAuVcTr3njqKfH?p=preview

getData: function () {
          var obj = {};
          var jsonData = JSON.stringify({ obj: obj }); //For POST
          var req = {
              method: 'POST',
              url: 'http://api.openweathermap.org/data/2.5/weather?id=2172797&appid=d436c04d23a5a44329eb8255190a84be',
          };
          return this.http.post(req.url, req.data, req)
          .toPromise()
          .then(function (response) {
              return response;

          });
      }

可能有一个明显的原因是您的网址与您的解决方案相关。

希望这会有所帮助。

由于