ngAutocomplete is an angular directive that allows you to create an autocomplete textbox for addresses using google places API.

<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script>

<input type="text" class="form-control" id="originAddress"  
                placeholder="Street address"
                ng-model="originAddress"
                details="origin"
                options="boundaries"
                autocomplete="off" 
                autocorrect="off" 
                autocapitalize="off" 
                spellcheck="false"
                ng-autocomplete
                required>

Mobile browser selection bug

"Oscar I can't select the address using a mobile phone, can you please take a look?"

This week a bug hunted me for a few hours where the ngAutocomplete options failed to click on mobile browsers.

If you're facing the same problem the solution is to avoid the touchend event propagation at the pac-container container level.

$('.pac-container').on('touchend', function(e){
    e.stopPropagation();
});

Before applying the solution be sure that you create a reusable angular directive. Keep your code nice and tidy!

Oscar out.