Simple handy example of google places api with angularjs directive

AngularGooglePlaces

html:

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script>
<div ng-app="app" ng-controller="mainController">
    Selected place: {{selectedPlace}} <br/>
  
    <input ng-model="selectedPlace" googleplace/>
    
</div>

js:

var app = angular.module('app', []).controller('mainController', ['$scope', function ($scope) { }]);

app.directive('googleplace', function() {
    return {
        require: 'ngModel',
        link: function(scope, element, attrs, model) {
            var options = {
                types: [],
                componentRestrictions: {country: 'tr'} //set country here
            };
            scope.googlePlace = new google.maps.places.Autocomplete(element[0], options);

            google.maps.event.addListener(scope.googlePlace, 'place_changed', function() {
                scope.$apply(function() {
                    model.$setViewValue(element.val());                
                });
            });
        }
    };
});