javascript - Building an $http request from form field in AngularJS -

i trying build basic angularjs weather app takes users zip code form , makes api call current forecast. app has 2 views/routes. first view has input field , submit button collect user's zip. second view display forecast.

what want have happen have user put zip code form , upon submitting it, build url make http request call with. final url like:

baseurl + userzipfromform + .json

i tried using angular's $http, won't let me pass in variable url expecting string. don't think trying qualify query parameter , i've read things creating factory little turned around @ moment.

if using ng-submit trigger building url, how make $http request , put response right scope use in forecast view?

html:

<div class="text-center">   <h2>enter zip</h2>    <form name="myform" ng-submit="submitmyform()">     <input type="text" ng-model="zipcode" />     <button type="submit" value="submit">submit!</button>   </form>    <pre>zip = <span ng-bind="zipcode"></span></pre>  </div> 

js:

    var  myweather = angular.module('myweather', ['ngroute']);      myweather.config(function($routeprovider, $locationprovider) {         $routeprovider              // route home page             .when('/', {                 templateurl : 'views/home.html',                 controller  : 'maincontroller'             })              // route forecast page             .when('/forecast', {                 templateurl : 'views/forecast.html',                 controller  : 'maincontroller'             });              $locationprovider.html5mode(true);     });      myweather.controller('maincontroller', ['$scope', '$http', '$location', function($scope, $http, $location) {        // create message display in our view       $scope.greeting = 'here weather for:';        $scope.submitmyform=function(){         var data= $scope.zipcode;          var url = "https://api.wunderground.com//" + data + ".json"          console.log(url);          $http({           method: 'get',           url: url         }).then(function successcallback(response) {             $scope.weather = response.data.current_observation;               return $scope.weather;           }, function errorcallback(response) {          });        };     }]);