如何将param从控制器传递到AngularJs中的服务

我目前正在开发一个项目以帮助我更好地理解angularjs！我目前坚持如何从控制器传递参数到服务。如何将param从控制器传递到AngularJs中的服务

在我的程序中，当用户输入一个输入点击一个按钮时，我创建了一个名为“GetForecastByLocation”的函数。从那里我想接受他们的输入，然后将它传递给service.js中的http调用。

最初，$ http.get是一个很长的API网址字符串，但我搜索了一下，似乎我应该在尝试更改字符串的一部分时使用参数。截至目前，我知道参数被硬编码到一个特定的城市，但我想要接受新的输入并将vm.city的值传递给$ http.get调用。

如果有人可以帮助，我将不胜感激。谢谢！

controller.js

var app = angular.module('weatherApp.controllers', []) 
    app.controller('weatherCtrl', ['$scope','Data', 
     function($scope, Data) { 

     $scope.getForecastByLocation = function(myName) { 
      $scope.city = myName; 
      Data.getApps($scope.city);}, 

     Data.getApps(city) 
     .then(function(data)){ 
     //doing a bunch of things like converting units, etc 
     }, 
     function(res){ 
      if(res.status === 500) { 
      // server error, alert user somehow 
     } else { 
      // probably deal with these errors differently 
     } 
     }); // end of function 
}]) // end of controller

service.js

.factory('Data', function($http, $q) { 
     var data = [], 
      lastRequestFailed = true, 
      promise; 
     return { 
      getApps: function() { 
      if(!promise || lastRequestFailed) { 
      promise = $http.get('http://api.openweathermap.org/data/2.5/weather?',{ 
       params: { 
       q: Tokyo, 
       } 
      }) 
      .then(function(res) { 
       lastRequestFailed = false; 
       data = res.data; 
       return data; 
      }, function(res) { 
       return $q.reject(res); 
      }); 
     } 
     return promise; 
     } 
    } 
});

来源

2017-07-03 hiswendy

为什么不加一个参数'getApps'？该工厂看起来像'getApps：function（city）{...'和调用网站像'Data.getApps（$ scope.city）' – Will

hi @wilusdaman！对不起，但我对angularjs很陌生。如果你能显示完整的代码/详细说明，我将不胜感激！谢谢！ //在你的代码中，我是否仍然需要params？如果我理解正确，函数（城市）的值填入q：city，对不对？ – hiswendy

将参数传递给工厂方法是不超过将参数传递给一个普通的旧功能不同。

首先，建立getApps接受一个参数：

.factory('Data', function($http, $q){ 
    // ... 
    return { 
     getApps: function(city){ 
      promise = $http.get(URL, { 
       params: {q: city} 
      }).then(/* ... */); 
      // ... 
      return promise; 
     } 
    }; 
});

然后通过它你的论点：

$scope.getForecastByLocation = function(myName) { 
    $scope.city = myName; 
    Data.getApps($scope.city); 
}

来源

2017-07-03 20:49:39 Will

谢谢！我知道这将起作用，因为我尝试传递一个参数，并且它改变了。我希望这可以问，但我有跟进问题。更早的时候，我没有显示我的整个controller.js代码，现在我已经更新了它，但是点击按钮后调用的函数并没有将城市发送到服务。我想这可能是因为我把getForecastbyLocation放在控制器中。我认为这是错误的地方，但我不知道该把它放在哪里。你有任何建议/建议吗？再一次感谢你！ – hiswendy

你的'ng-click'是什么样的？ – Will

它目前看起来像这样： SUBMIT' – hiswendy

这就像一个值设置为函数的上下文变量。

Services.js

的服务的简单的例子。

.factory('RouteService', function() { 
    var route = {}; // $Object 

    var setRoute_ = function(obj) 
    { 
     return route = obj; 
    }; 

    var getRoute_ = function() 
    { 
     if(typeof route == 'string') 
     { 
      return JSON.parse(route); 
     } 

     return null; 
    }; 

    return { 
     setRoute: setRoute_, 
     getRoute: getRoute_ 
    }; 
})

Controllers.js服务使用的

简单的例子：

.controller('RoutesCtrl', function ($scope, RouteService) { 
    // This is only the set part. 
    var route = { 
     'some_key': 'some_value' 
    }; 

    RouteService.setRoute(route); 
})

来源

2017-07-03 20:50:12

如何将param从控制器传递到AngularJs中的服务

回答

相关问题