自从迁移到 Angular 13 以来未捕获 DOMException

Question

我在我的 Angular 项目中使用 Bootstrap 4.6.2。其中一个组件有一张带有 ngb-accordion 的表格。在我将项目迁移到 Angular 13 之前，一切都运行良好。 现在，当导航到包含手风琴的页面时，我在控制台中收到以下错误。它不会阻止导航的发生，而且我仍然可以打开/关闭手风琴。我只是希望错误消息消失：

Uncaught DOMException: Failed to execute 'querySelector' on 'Element': '#4bdecde7-0564-475c-a160-655206d24c9e' is not a valid selector.
    at t._getPanelElement (http://localhost:4200/main.js:1:347916)
    at http://localhost:4200/main.js:1:346729
    at Array.forEach (<anonymous>)
    at qf.forEach (http://localhost:4200/main.js:1:91610)
    at Nt._next (http://localhost:4200/main.js:1:346704)
    at Nt.__tryOrUnsub (http://localhost:4200/main.js:1:5045)
    at Nt.next (http://localhost:4200/main.js:1:4286)
    at ae._next (http://localhost:4200/main.js:1:3479)
    at ae.next (http://localhost:4200/main.js:1:3253)
    at lP._next (http://localhost:4200/main.js:1:181212)

我相信这是由于 Bootstrap 版本造成的，但我不知道如何解决它。这是我的 package.json 的摘录以供参考：

"dependencies": {
    "@angular/animations": "^13.4.0",
    "@angular/common": "~13.4.0",
    "@angular/compiler": "~13.4.0",
    "@angular/core": "~13.4.0",
    "@angular/forms": "^13.4.0",
    "@angular/localize": "^13.4.0",
    "@angular/platform-browser": "~13.4.0",
    "@angular/platform-browser-dynamic": "~13.4.0",
    "@angular/router": "~13.4.0",
    "@angular/service-worker": "^13.4.0",
    "@ng-bootstrap/ng-bootstrap": "^10.0.0",
    "@types/file-saver": "^2.0.7",
    "bootstrap": "^4.6.2",
    "file-saver-es": "^2.0.5",
    "font-awesome": "^4.7.0",
    "jquery": "^3.4.1",
    "ngx-toastr": "^13.2.1",
    "node-pre-gyp": "^0.12.0",
    "popper.js": "^1.14.3",
    "rxjs": "^6.5.5",
    "source-map": "^0.8.0-beta.0",
    "tslib": "^2.6.2",
    "zone.js": "^0.11.4"   },   "devDependencies": {
    "@angular-devkit/build-angular": "^13.3.11",
    "@angular/cli": "^13.3.11",
    "@angular/compiler-cli": "^13.2.7",
    "@angular/language-service": "~13.4.0",
    "@types/jasmine": "^3.10.18",
    "@types/jasminewd2": "^2.0.13",
    "@types/node": "^12.20.55",
    "codelyzer": "^5.1.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~6.4.3",
    "karma-chrome-launcher": "^3.1.1",
    "karma-coverage-istanbul-reporter": "^2.1.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.2",
    "karma-phantomjs-launcher": "^1.0.4",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "^6.1.3",
    "typescript": "^4.4.4"   }

请帮忙！

Answer 1

正如预期的那样，该问题是由 Bootstrap 引起的。我升级了以下软件包以使其正常工作：

"@ng-bootstrap/ng-bootstrap": "^12.1.2", "@popperjs/core": "^2.11.8", “引导”：“^5.3.0”，