web-dev-qa-db-ja.com

Angular v6、rxjs v6エラーTS2339：プロパティ 'pipe'はタイプ 'OperatorFunctionに存在しません

新しいpipeメソッドを使用してAngular 5.5/rxJS5.5で正常に動作するコードをAngular 6/rxJS6using rxjs-lintパッケージと次のコマンド

npm i -g rxjs-tslint
rxjs-5-to-6-migrate -p tsconfig.json

インポートなどは期待どおりに修正されましたが、Angularのv5/RxJSの5.5で正常に機能したコードでエラーが発生しています。

 error TS2339: Property 'pipe' does not exist on type 'OperatorFunction<{}, {} | RouterEvent | RouteConfigLoadStart | RouteConfigLoadEnd | ChildActivati...'.

Rxjs6-compatパッケージを削除しましたが、違いはありません。これは、ビルドがv5.5よりも前のバージョンのrxJSを持っていると考えているかのようです。 package.json npminstallで使用すると次のようになります...

"dependencies": {
    "@angular/animations": "^6.0.2",
    "@angular/cdk": "^6.0.2",
    "@angular/common": "^6.0.2",
    "@angular/compiler": "^6.0.2",
    "@angular/core": "^6.0.2",
    "@angular/flex-layout": "^6.0.0-beta.15",
    "@angular/forms": "^6.0.2",
    "@angular/http": "^6.0.2",
    "@angular/material": "^6.0.2",
    "@angular/platform-browser": "^6.0.2",
    "@angular/platform-browser-dynamic": "^6.0.2",
    "@angular/router": "^6.0.2",
    "@ngrx/effects": "^6.0.0-beta.3",
    "@ngrx/entity": "^6.0.0-beta.3",
    "@ngrx/router-store": "^6.0.0-beta.3",
    "@ngrx/store": "^6.0.0-beta.3",
    "@ngrx/store-devtools": "^6.0.0-beta.3",
    "@ngx-translate/core": "^9.0.1",
    "core-js": "^2.5.2",
    "hammerjs": "^2.0.8",
    "lodash": "^4.17.4",
    "material-design-icons-iconfont": "^3.0.3",
    "nsp": "^3.2.1",
    "passport": "^0.4.0",
    "passport-Azure-ad": "^3.0.12",
    "rxjs": "^6.1.0",
    "zone.js": "^0.8.26"
  },

Rxjs演算子のインポートはrxjs6形式です。

import { filter, map, merge, mergeMap } from 'rxjs/operators';

動作したが、現在このエラーが発生するステートメントは次のとおりです。

// Change page title on navigation or language change, based on route data
merge(this.translateService.onLangChange, onNavigationEnd)
  .pipe(
    map(() => {
      let route = this.activatedRoute;
      while (route.firstChild) {
        route = route.firstChild;
      }
      return route;
    }),
    filter(route => route.outlet === 'primary'),
    mergeMap(route => route.data)
  )
  .subscribe(event => {
    const title = event['title'];
    if (title) {
      this.titleService.setTitle(this.translateService.instant(title));
    }
  });

私は何を逃しましたか？ rxJS 5.5で問題がなかったのに、パイプがこのエラーを引き起こしているのはなぜですか？

angular6rxjs6
4
user8713457

交換

merge(this.translateService.onLangChange, onNavigationEnd).pipe(

これとともに

this.router.events.pipe(filter(event => event instanceof NavigationEnd), 
  map(() => {
    let route = this.activatedRoute;
0
Suchith Arella

次のようにマージをインポートする必要があります。

import { merge } from 'rxjs';
26
Schtrudell

マージ演算子は"rxjs/observable"からインポートする必要があります。

このような

import { merge } from "rxjs/observable/merge";
0
faety_sal