Блог

У меня есть приложение angular7, которое работает в локальной среде точно без ошибок. Затем я загрузил сборку (с помощью ng build команды) приложения angular Aws S3 , которая также работает нормально. Но когда я загружаю производственную сборку (с помощью command ng build --prod --aot ) в Aws S3 so, она выдает ошибку, подобную этой

 TypeError: this.router.events.filter is not a function
  

Я искал это this.router.events.filter во всем своем проекте, закомментировал эту часть и снова запустил приложение на локальном компьютере, чтобы оно работало нормально, но когда я снова загрузил производственную сборку этого приложения, оно все еще показывает ту же ошибку. Как я могу это исправить?

Вот мои зависимости от проекта angular.

 "dependencies": {
"@agm/core": "^1.0.0-beta.5",
"@amcharts/amcharts4": "^4.0.14",
"@angular/animations": "^7.2.9",
"@angular/cdk": "^7.3.4",
"@angular/common": "^7.1.4",
"@angular/compiler": "^7.1.4",
"@angular/core": "^7.1.4",
"@angular/forms": "^7.1.4",
"@angular/http": "^7.1.4",
"@angular/platform-browser": "^7.1.4",
"@angular/platform-browser-dynamic": "^7.1.4",
"@angular/router": "^7.1.4",
"@nebular/auth": "^3.4.0",
"@nebular/security": "^3.4.0",
"@nebular/theme": "^3.4.0",
"@ng-bootstrap/ng-bootstrap": "^4.0.1",
"@swimlane/ngx-datatable": "^14.0.0",
"@syncfusion/ej2-angular-calendars": "^16.4.52",
"@types/highcharts": "^5.0.36",
"angular2-highcharts": "^0.5.5",
"angular2-notifications": "^2.0.0",
"bootstrap": "^4.2.1",
"c3": "^0.6.12",
"canvas-gauges": "^2.1.5",
"cli-update": "^3.2.5",
"core-js": "^2.6.1",
"css-animator": "^2.3.1",
"d3": "^5.7.0",
"eva-icons": "^1.1.1",
"famfamfam-flags": "^1.0.0",
"feather-icons-sass": "^1.0.0",
"font-awesome-scss": "^1.0.0",
"hammerjs": "^2.0.8",
"jquery": "^3.3.1",
"moment": "^2.24.0",
"ng-click-outside": "^4.0.0",
"ng-recaptcha": "^4.2.1",
"ng-select": "^1.0.1",
"ng-socket-io": "^0.2.4",
"ng2-file-upload": "^1.3.0",
"ng2-google-charts": "^3.5.0",
"ng2-odometer": "^1.1.3",
"ng2-toasty": "^4.0.3",
"ng2-ui-switch": "^1.0.2",
"ng2-validation": "^4.2.0",
"ng4-loading-spinner": "^1.2.3",
"ngx-bar-rating": "^1.1.0",
"ngx-captcha": "^6.3.0",
"ngx-carousel": "^1.3.5",
"ngx-chips": "^2.0.0-beta.0",
"ngx-color-picker": "^7.2.2",
"ngx-datatable": "^1.0.3",
"ngx-loading": "^2.0.1",
"ngx-pagination": "^3.2.1",
"ngx-perfect-scrollbar": "^7.1.0",
"node-rtsp-stream": "0.0.5",
"node-rtsp-stream-es6": "^1.0.6",
"node-sass": "^4.11.0",
"nodegit": "^0.24.1",
"npm-check-updates": "^2.15.0",
"rxjs": "^6.3.3",
"rxjs-compat": "^6.3.3",
"save": "^2.3.3",
"save-dev": "^2.0.0",
"screenfull": "^4.0.0",
"streamedian": "git://github.com/Streamedian/html5_rtsp_player.git",
"sweetalert2": "^7.33.1",
"tslib": "^1.9.0",
"zone.js": "^0.8.26"
  

}

events Свойство Router имеет тип Observable<Event> , поэтому, если вы хотите отфильтровать эти события маршрутизатора, вам нужно использовать filter оператор из rxjs/operators , например:

 import { NavigationEnd } from '@angular/router';
import { filter, tap } from 'rxjs/operators';

// ...

this.router.events.pipe(
  filter(event => event instanceof NavigationEnd),
  tap(event => {
    // ... whatever to do with the NavigationEnd event
  })
);
  

Если вы не использовали его самостоятельно в своем проекте, возможно, сторонняя библиотека использует старую версию router.events.filter .