Last active
July 16, 2020 04:39
-
-
Save almino/355a0151e646a5ba48346e45de866485 to your computer and use it in GitHub Desktop.
place componnent
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export class CurrentGeolocation { | |
public static getGeolocation(options?: any) : Promise<Position> { | |
if (window.navigator.geolocation) { | |
/* https://gist.github.com/varmais/74586ec1854fe288d393 */ | |
return new Promise(function (resolve, reject) { | |
navigator.geolocation.getCurrentPosition(resolve, reject, options); | |
}); | |
} | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* https://stackoverflow.com/a/42177083/437459 */ | |
declare var google; | |
import { Options as PlacesOptions } from 'ngx-google-places-autocomplete/objects/options/options'; | |
import { ComponentRestrictions } from 'ngx-google-places-autocomplete/objects/options/componentRestrictions'; | |
export class Options extends PlacesOptions { | |
public componentRestrictions : ComponentRestrictions = new ComponentRestrictions({ | |
country: 'BR' | |
}); | |
/* constructor(opt?: Partial<PlacesOptions>) { | |
super(opt); | |
} */ | |
setBounds(lat: number, lng: number) : void { | |
this.bounds = new google.maps.LatLngBounds( | |
new google.maps.LatLng({ lat, lng }) | |
); | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<mat-form-field> | |
<input | |
placeholder="Local" | |
[disabled]="disabled" | |
matInput | |
ngx-google-places-autocomplete | |
[options]="options" | |
#placesRef="ngx-places" | |
(onAddressChange)="handleAddressChange($event)"/> | |
<mat-spinner | |
matSuffix | |
color="accent" | |
[diameter]="20" | |
*ngIf="loading"> | |
</mat-spinner> | |
</mat-form-field> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Component, OnInit, ViewChild } from '@angular/core'; | |
import { GooglePlaceDirective } from 'ngx-google-places-autocomplete'; | |
import { Options } from './options.model'; | |
import { Address } from 'ngx-google-places-autocomplete/objects/address'; | |
import { CurrentGeolocation } from './current-geolocation'; | |
@Component({ | |
selector: 'app-place', | |
templateUrl: './place.component.html', | |
// styleUrls: ['./place.component.scss'] | |
}) | |
export class PlaceComponent implements OnInit { | |
@ViewChild("placesRef") places : GooglePlaceDirective; | |
public options : Options = new Options(); | |
protected disabled : boolean = true; | |
protected loading : boolean = true; | |
constructor() { | |
this.options.types = ['establishment']; | |
CurrentGeolocation.getGeolocation().then((position : Position) => { | |
this.options.setBounds(position.coords.latitude, position.coords.longitude); | |
this.places.reset(); | |
this.disabled = false; | |
this.loading = false; | |
}) | |
} | |
ngOnInit() { } | |
public handleAddressChange(address: Address) { | |
console.log(this.options.bounds); | |
console.log(address); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment