service gets URL for $http API request from controller - Angular.js

Question

I want a service that grabs info from an API but only after clicking an HTML element.

"freegeoip.net/json/" + ip_address

The problem is, my service and URL above is being called before the click occurs.

app.service("ips", function ($http, $q)
{
    // Grab json
    var deferred = $q.defer();
    $http.get("http://www.freegeoip.net/json/" + ip_address).then(function (data)
    {
        deferred.resolve(data);
    });

    this.getItems = function ()
    {
        console.log(deferred.promise);
        return deferred.promise;
    }
})

Can someone show me I can define this variable ip_address later in a click?

///Inside the controller

promise.then(function (data)
{
    $scope.items = data.data.items;
});
$scope.defineIP= function(item)
{
   ip_address = "212.38.168.60"
   return ip_address;
}

The problem here is that I have no clue how to take this value i defined for ip_address and inject it into the service.

are you calling getItems Method in controller on click of some element ? post the code related to it ! — user1608841
– user1608841, Commented Jul 28, 2017 at 11:10
the getItems method is being called immediately when the controller is initialized. If you have a smarter way of doing this, i'm happy to hear it. — Ian Steffy
– Ian Steffy, Commented Jul 28, 2017 at 11:16

georgeawg · Accepted Answer · 2017-07-28 13:24:41Z

2

Your Code should go like this.

app.service("ips", function ($http) {
    this.getItems = function (ip_address) {
       return  $http.get("freegeoip.net/json/" + ip_address)
    }
});

and in controller :

$scope.defineIP= function(){
   var ip_address = "212.38.168.60"
   ips.getItems(ip_address).then(function(response){
     console.log(response);
   }) 
}

Dont forget to add "ips" as DI in controller.

As you want to grab info on click of HTML element then you should call like below:

 <button ngClick="defineIP()">Click Here</button>

You dont need to inject $q in service as $http returns you the Promise Object so that you can use .then() method directly in controller

edited Jul 28, 2017 at 13:24

georgeawg

49k13 gold badges78 silver badges98 bronze badges

answered Jul 28, 2017 at 11:22

user1608841

2,4751 gold badge29 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ian Steffy Over a year ago

This is also 100% correct and works. I am torn as to which Answer I should give the Green Check to. Who's answer is more efficient?

user1608841 Over a year ago

your choice ... :) however never use $q in $http (may be sometimes in some cases you may need to use $q); it actually returns promise

Indhu · Accepted Answer · 2017-07-28 11:19:53Z

0

The $http request will be called once u inject the service. So you should be called like this.

app.service("ips", function ($http, $q)
{
    // Grab json    

    this.getItems = function (ip_address)
    {
        var deferred = $q.defer();
        $http.get("freegeoip.net/json/" + ip_address).then(function (data)
        {
          deferred.resolve(data);
        });
        return deferred.promise;
    }
})

In controller:

var promise = ipsService.getItems(ip_address);

edited Jul 28, 2017 at 11:19

answered Jul 28, 2017 at 11:16

Indhu

3991 gold badge6 silver badges19 bronze badges

3 Comments

Ian Steffy Over a year ago

And then in the controller, which has the service ips, do I call this.getItems(someIPstring)?

Ian Steffy Over a year ago

Your answer as well Rahul's are correct but I can only give one green check. Who's is more efficient?

georgeawg Over a year ago

This is a $q.defer anti-pattern. The promise hangs if the $http request is rejected. See Is this a “Deferred Antipattern”?.

Collectives™ on Stack Overflow

service gets URL for $http API request from controller - Angular.js

2 Answers 2

2 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related