Angular.js HTTP Concatenation - Changing URL - Breaks Angular

Question

Update. Not really a duplicate as concatenation, as I understand it, is not working in this case.

I've tried the following as kindly provided by Baszz below but it seems to break angular. Test expressions I have showing latitude, longitude and the postcode in the view show the expression code instead when I use this:

$http.get('//api.postcodes.io/postcodes?limit=1&lon=' + 
              $geolocation.position.coords.longitude + 
              '&lat=' +  
              $geolocation.position.coords.latitude);

I'm using the ngGeolocation module for Angular to find the latitude and longitude of the user in order to work out the postcode using postcodes.io.

Latitude is at: $geolocation.position.coords.latitude Longitude is at: $geolocation.position.coords.longitude

The following example gives a postcode result:

$http.get('//api.postcodes.io/postcodes?limit=1&lon=-0.1276250&lat=51.5033630')

I want to insert the longitude and latitude into the above line of code. How can this be done?

The complete code:

var myApp = angular.module('myApp', ['ngGeolocation']);

myApp.controller('geolocCtrl', ['$scope', '$geolocation', '$http',
    function($scope, $geolocation, $http) {
      $scope.$geolocation = $geolocation


          // basic usage
          $geolocation.getCurrentPosition().then(function(location) {
            $scope.location = location
          });

          // regular updates
          $geolocation.watchPosition({
            timeout: 60000,
            maximumAge: 2,
            enableHighAccuracy: true
          });


       $scope.testing = "300";

          $scope.coords = $geolocation.position.coords; // this is regularly updated
          $scope.error = $geolocation.position.error; // this becomes truthy, and has 'code' and 'message' if an error occurs

          $http.get('//api.postcodes.io/postcodes?limit=1&lon=-0.1276250&lat=51.5033630')

.success(function (data) {

           $scope.postcode = data.result[0].postcode;
           var postcode2 = $scope.postcode


        })
        .error(function (data, status) {

            console.log(data);

        });


        }]);

When Angular "breaks" and shows unevaluated Angular expressions in the HTML usually means there is an error message on the browser console telling you what is wrong with your code :) If you still need help, you should edit this question and add that error message. — Sunil D.
– Sunil D., Commented May 1, 2015 at 17:27
It was a problem with the ngGeolocation module. Thanks for your help. — winder28
– winder28, Commented May 1, 2015 at 18:17

Bas Slagter · Accepted Answer · 2015-05-01 12:14:30Z

0

Based on the information you gave I would say:

        $http.get('//api.postcodes.io/postcodes?limit=1&lon=' + 
              $geolocation.position.coords.longitude + 
              '&lat=' +  
              $geolocation.position.coords.latitude);

answered May 1, 2015 at 12:14

Bas Slagter

9,9419 gold badges51 silver badges81 bronze badges

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

4 Comments

winder28 Over a year ago

This doesn't seem to work for me - breaks angular (showing expression code in the view.)

Bas Slagter Over a year ago

How about you show us some more code or learn more about AngularJS first?

winder28 Over a year ago

I was trying to keep it relevant but sure. I've added the complete code.

winder28 Over a year ago

Thanks for your help anyway, it has gotten me a little further on with the problem.

winder28 · Accepted Answer · 2015-05-01 18:18:05Z

0

It was a problem with the module.

answered May 1, 2015 at 18:18

winder28

154 bronze badges

Collectives™ on Stack Overflow

Angular.js HTTP Concatenation - Changing URL - Breaks Angular

2 Answers 2

4 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related