Angular 16升级后ngx-google-places-autocomplete无法使用求助

数据老陈

2026-7-17

Angular 16升级后ngx-google-places-autocomplete组件报错解决办法

问题详情

升级至Angular 16版本后，集成ngx-google-places-autocomplete组件时触发如下错误：

main.ts:29 Unhandled Promise rejection: GooglePlaceModule does not have a module def (ɵmod property) ; Zone: <root> ; Task: Promise.then ; Value: Error: GooglePlaceModule does not have a module def (ɵmod property)

当前集成代码：

import { GooglePlaceModule } from 'ngx-google-places-autocomplete';

@NgModule({
  declarations: [...],
  imports: [..., GooglePlaceModule],
  providers: [...]
  exports: [],
  bootstrap: [AppComponent],
})
export class AppModule {
  constructor() {}
}

解决方案

升级组件到Angular 16兼容版本
旧版组件未适配Angular 16的模块定义规范，执行命令更新：
```
npm install ngx-google-places-autocomplete@latest
```
若最新版仍有问题，可查看组件版本说明，指定安装明确支持Angular 16的版本。
确认Ivy编译启用状态
Angular 16默认启用Ivy，若项目禁用了Ivy会导致不兼容。检查tsconfig.json中的配置：
```
"angularCompilerOptions": {
  "enableIvy": true
}
```
清理缓存并重新构建
更新组件后清理缓存，避免旧文件残留导致的异常：
```
npm cache clean --force
rm -rf node_modules package-lock.json
npm install
ng build --clean
```
更换替代组件（备选方案）
若组件长期未维护，可改用官方@angular/google-maps组件，通过其Autocomplete服务实现地址自动完成功能。