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., May 01 '15 at 17:27
It was a problem with the ngGeolocation module. Thanks for your help. — winder28, May 01 '15 at 18:17

score 0 · Answer 1 · answered May 01 '15 at 12:14

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 01 '15 at 12:14

Bas Slagter

9,831
7
47
78

This doesn't seem to work for me - breaks angular (showing expression code in the view.) – winder28 May 01 '15 at 12:26
How about you show us some more code or learn more about AngularJS first? – Bas Slagter May 01 '15 at 12:27
I was trying to keep it relevant but sure. I've added the complete code. – winder28 May 01 '15 at 12:31
Thanks for your help anyway, it has gotten me a little further on with the problem. – winder28 May 01 '15 at 13:41

score 0 · Answer 2 · answered May 01 '15 at 18:18

0

It was a problem with the module.

answered May 01 '15 at 18:18

winder28

5
3

Angular.js HTTP Concatenation - Changing URL - Breaks Angular

2 Answers2