Skip to content

Latest commit

 

History

History
32 lines (23 loc) · 1.86 KB

README.md

File metadata and controls

32 lines (23 loc) · 1.86 KB
Raw

GoogleMaps [Angular v8.3.2]

Hello This is a sample Project in Angular for using Google Places Autocomplete with the native Angular Google Maps and customising the map dynamically.

How to Run:

Clone the Repo and run npm install. After that insert you Google Maps API Key in environment (and environment.prod if you like).

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Code Features:

The App has been built using the Following Libraries:

  1. AGM-Core
  2. Angular Material - For Modal, Input and the Buttons
  3. Materialize Css - For a card View and a base layout and Typography
  4. @types/googlemaps: For Google namespace and classes

Project Structure

  • shared: This Folder Contains all modules, directives, interfaces, and such that would be used throughout the App.
    1. constants: All App Constants
    2. directives: Separate Modules that import and export directives (Google Places AutoComplete)
    3. interfaces: Models for our Code.
    4. Modals: All the Common Modals used. Using Angular Material.
      • Common Error Modal: This is called through the data Service. Uses inner HTML to enable passing of parseable html instead of a string error message.
    5. providers: The Data Service. We use dynamic types for get and post, and use the data service for adding postparams, headers and handling common errors.
    6. Styles:
      • Materialize CSS: We use the materialize Grid, typography and helpers, and comment out the rest of the unrequired components.
      • Angular Material: We Define a custom theme for our application. We have chosen a cool blue gray theme for our application.
      • theme: Here we define our own variables and helpers for use throughout our application.