Как передать параметр от контроллера к службе в AngularJs

В настоящее время я работаю над проектом, который поможет мне лучше понять angularjs! В настоящее время я застрял в том, как передать параметр из контроллера в службу.

В моей программе я создал функцию под названием «GetForecastByLocation», когда пользователь вводит ввод и нажимает кнопку. Оттуда я хочу получить их ввод, а затем передать его http-вызову в service.js.

Первоначально $http.get был в длинной гигантской строке URL-адреса API, но я погуглил, и кажется, что я должен использовать параметры при попытке изменить часть строки. На данный момент я знаю, что параметр жестко закодирован для определенного города, но я хочу получить новый ввод и передать значение vm.city вызову $http.get.

Если кто-то может помочь, я был бы очень признателен. Благодарю вас!

контроллер.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 

сервис.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;
      }
   }
});

person hiswendy    schedule 03.07.2017    source источник
comment
Почему бы не добавить параметр к getApps? Завод будет выглядеть как getApps: function(city){ ..., а сайт вызова как Data.getApps($scope.city).   -  person wbadart    schedule 03.07.2017
comment
привет @wilusdaman! Извините, но я очень новичок в angularjs. Если вы можете показать полный код/уточнить, я был бы очень признателен! Благодарю вас! // В вашем коде мне все еще нужны параметры? Если я правильно понимаю, значение из функции (город) заполняет q: город, верно?   -  person hiswendy    schedule 03.07.2017


Ответы (2)


Передача аргументов фабричному методу ничем не отличается от передачи аргументов старой простой функции.

Сначала настройте 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);
}
person wbadart    schedule 03.07.2017
comment
спасибо! Я знаю, что это сработает, потому что я пытался передать параметр, и он изменился. Я надеюсь, что это нормально, чтобы спросить, но у меня есть дополнительный вопрос. Итак, ранее я не показывал весь свой код controller.js, а теперь я его обновил, но функция, вызываемая после нажатия кнопки, не отправляет город в сервис. Я думаю об этом, возможно, из-за того, где я разместил getForecastbyLocation в контроллере. Я думаю, что это не в том месте, но я не уверен, куда его поместить. Есть ли у вас какие-либо предложения/советы? Еще раз спасибо! - person hiswendy; 04.07.2017
comment
как выглядит твой ng-click? - person wbadart; 04.07.2017
comment
Сейчас это выглядит так <md-button class="md-raised" ng-click="getForecastByLocation(myName)">SUBMIT</md-button> - person hiswendy; 04.07.2017
comment
Попался. Я думаю, вам нужно getForecastByLocation(city), так как $scope.city существует, а $scope.myName нет (или так кажется из кода, которым вы поделились) - person wbadart; 04.07.2017
comment
Будет ли иметь значение размещение $scope.getForecastByLocation в контроллере? Или исходное размещение, показанное в коде, подходит? - person hiswendy; 04.07.2017
comment
Это просто задание, так что нет, порядок не имеет значения. - person wbadart; 04.07.2017

Это похоже на установку значения контекстной переменной функции.

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_
    };
})

Контроллеры.js

Простой пример использования Сервиса:

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

    RouteService.setRoute(route);
})
person James    schedule 03.07.2017