can't bint to options

[psykolm22]

trafficstars

From @andikas on February 22, 2017 11:25

Hi, need Help. I got an issue when I use this code. I've follow the instalation steps, but still got this error. Igot this error. Unhandled Promise rejection: Template parse errors: Can't bind to 'options' since it isn't a known property of 'input'. (" class="input-group"> <input type="text" size="100" [(ngModel)] = "address" [ERROR ->][options]='options' (setAddress) = "getAddress($event)" (street_number) = 'street_number=$event'"): HomeComponent@40:1 ; Zone: ; Task: Promise.then ; Value:

Any suggestion? Here's my module `import {GooglePlaceModule} from 'ng2-google-place-autocomplete';

export const appRoutes: Routes = [ { path: '', component: AppComponent, children:[ { path: '', component: NavbarComponent, outlet: 'navbar'}, { path: '', component: FooterComponent, outlet: 'footer'}, { path: '', component: CopyrightComponent, outlet: 'copyright'}, { path: '', component: HomeComponent}, { path : 'property', component: PropertyComponent} ] } ]; @NgModule({ imports: [ BrowserModule, CarouselModule, CommonModule, FormsModule, HttpModule, GooglePlaceModule, DropdownModule.forRoot(), `

My Component export class AppComponent { public options = {types: ['address'],componentRestrictions: { country: 'FR' }} getAddress(place:Object) { console.log("Address", place); } }

and my input form same as with the tutorial.

Copied from original issue: psykolm22/ng2-google-place-autocomplete#11

[psykolm22]

From @larschla on April 23, 2017 9:7

Any news on this. I'm also getting this error.

[psykolm22]

it's still same with angular-google-place now ?

[desertfoxmb]

I also have this issue. Upgrade from ng2-google-place-autocomplete. In uninstalled ng2-google-place-autocomplete, installed AngularGooglePlace, ensured that AngularGooglePlace was imported in app.module.

Angular 5.2.9/CLI 1.7.4

What is the status of this?

In component .ts file:

`import {
  AfterContentInit,
  AfterViewInit,
  ChangeDetectorRef,
  Component, DoCheck,
  ElementRef, EventEmitter,
  Input,
  NgZone, OnChanges,
  OnInit, Output, SimpleChanges,
  ViewChild
} from '@angular/core';
import {SmartAddress} from '../../../models/smartaddress';
import {DxAccordionComponent, DxButtonComponent, DxContextMenuComponent, DxDataGridComponent} from 'devextreme-angular';
import {isNullOrUndefined} from 'util';
import Guid from 'devextreme/core/guid';
import {AddressService} from '../../../services/address.service';
import {LookupService} from '../../../services/app-lookup.service';
import {CountyService} from '../../../services/county.service';
import {CityService} from '../../../services/city.service';
import {Address} from '../../../models/address';
import {Address as AngularGoogleAddress} from 'angular-google-place'
import CustomStore from 'devextreme/data/custom_store';
import {Observable} from 'rxjs/Observable';
import {AngularGooglePlaceModule} from 'angular-google-place';

@Component({
  selector: 'app-smartaddress',
  templateUrl: './smartaddress.component.html',
  styleUrls: ['./smartaddress.component.css']
})
export class SmartaddressComponent implements OnInit, AfterViewInit, AfterContentInit, OnChanges {

  @ViewChild(DxDataGridComponent) dataGrid: DxDataGridComponent;
  @ViewChild(DxContextMenuComponent) contextMenu: DxContextMenuComponent;
  @ViewChild(DxAccordionComponent) addressAccordion: DxAccordionComponent;
  @ViewChild(DxButtonComponent) addressEditButton: DxButtonComponent;
  @ViewChild('mapcomplete') mapSearch: ElementRef;

  @Input() expanded: boolean;
  @Input() sourceType: string;
  @Input() hideDefault: boolean;
  @Input() hideBad: boolean;
  @Input() hideCaption: boolean;
  @Input() controlId: string;
  @Input() defaultMailTypePhysical: boolean;

  @Input() model: SmartAddress[];
  @Output() modelChange = new EventEmitter<any>();

  smartAddressListPopup: any;

  contextMenuItems = ['Manual Edit', 'Show Map'];
  addressRetrieved = false;
  tmpCounty = '';
  tmpState = '';
  loadingCities = false;
  loadingCounties = false;
  loadingVisible: boolean;
  addressLoadingvisible: boolean;
  showFieldsIcon = 'fa fa-plus';
  editText = 'Show Fields';
  options = {types: ['address'], componentRestrictions: {country: 'US'}}`

In component template

 <input type="text" class="form-control"  [value]="defaultAddress.singleLineAddress()"
               [options]='options'
               (setAddress)="getAddress($event)"
               (street_number)='street_number=$event'
               (street)='street=$event'
               (city)='city=$event'
               (state)='state=$event'
               (district)='district=$event'
               (country)='country=$event'
               (postal_code)='postal_code=$event'
               (lat)='lat=$event'
               (lng)='lng=$event'
               (adr_address)='adr_address=$event'
               (name)='name=$event'
               (place_id)='place_id=$event'
               (types)='types=$event'
               (url)='url=$event'
               (utc_offset)='utc_offset=$event'
               (vicinity)='vicinity=$event'
               (photos)='photos=$event'
               (airport)='airport=$event'
               (CountryCodes)='CountryCodes=$event'
               id="mapcomplete" #mapcomplete
               ng2-google-place-autocomplete placeholder="Enter address"
               class="dx-texteditor dx-widget dx-textbox dx-texteditor-input"

               style="width:100%"/>