Google地方样式自动完成不起作用

Question

我正在使用Angular 9和Ionic 5，并且我正在使用Google Places自动完成输入地址。自动完成工作正常，并且由于this，我设法在浏览器上编辑了样式。然后，我进入样式表（scss），将这些样式放入各自的类（pac-容器，pac-item，pac-icon等）中，这些样式不会像我在scss文件中指定的那样显示。如果检查浏览器，则pac类中没有我的样式。我的代码如下：

profile.page.html

<ion-item class="br-5 mt">
   <ion-icon name="home" slot="start" class="ion-align-self-center" color="primary"></ion-icon>
   <ion-input id="googlePlaces" placeholder="Dirección" formControlName="address" required type="text"></ion-input>
</ion-item>

profile.page.scss

.pac-container{
    font-family: 'Open Sans';
}

.pac-item{
    margin-left:10px;
}

.pac-icon{
    display:none;
}

profile.page.ts

declare var google: any;
export class ProfilePage implements OnInit {
constructor(){}
ionViewDidEnter() {
    this.activeGooglePlace();
  }
activeGooglePlace() {

    let input = document.getElementById('googlePlaces').getElementsByTagName('input')[0];
    let autocomplete = new google.maps.places.Autocomplete(input, { types: ['geocode'] });
    autocomplete.setComponentRestrictions({ 'country': ['cl'] });
    google.maps.event.addListener(autocomplete, 'place_changed', () => {
      let place = autocomplete.getPlace();
      this.profileForm.controls.latitude.setValue(place.geometry.location.lat());
      this.profileForm.controls.longitude.setValue(place.geometry.location.lng());
      this.profileForm.controls.address.setValue(place.formatted_address);
    });
  } 
}

[我什至尝试阅读手机上的apk，因为我看到有些人无法使其在localhost上运行。但是仍然没有用。关于如何解决这个问题的任何想法？预先感谢。

Answer 1

我能够通过将所有这些类添加到主题变量.scss中来进行更改。真的很ham愧，我一开始无法检查那个。