Наблюдаемый Angular 7: main.73926b0c96716431d554.js:1 ОШИБКА Ошибка: Не перехвачено (в обещании): ошибка ссылки: rxjsSubscription не определена

#angular #rxjs #observable

#угловой #rxjs #доступен для наблюдения

Вопрос:

ПОЖАЛУЙСТА, ОБРАТИТЕ ВНИМАНИЕ, ЧТО ОШИБКА ВОЗНИКАЕТ ТОЛЬКО ТОГДА, КОГДА я СОЗДАЮ приложение И ЗАПУСКАЮ ЕГО с СЕРВЕРА. ОН ОТЛИЧНО РАБОТАЕТ, ЕСЛИ я ЗАПУСКАЮ НА LOCALHOST.

Я использую следующую библиотеку:

 "dependencies": {
"@angular/animations": "~7.2.5",
"@angular/common": "~7.2.5",
"@angular/compiler": "~7.2.5",
"@angular/core": "~7.2.5",
"@angular/forms": "~7.2.5",
"@angular/http": "~7.2.5",
"@angular/platform-browser": "~7.2.5",
"@angular/platform-browser-dynamic": "~7.2.5",
"@angular/router": "~7.2.5",
"@ngrx/effects": "^6.0.1",
"@ngrx/store": "^6.0.1",
"ace-builds": "^1.3.3",
"admin-lte": "^2.4.8",
"angular2-draggable": "^2.0.0-beta.2",
"autobahn": "^18.3.2",
"bootstrap": "^3.3.7",
"bootstrap-colorpicker": "^2.5.2",
"core-js": "^2.6.5",
"datatables.net": "^1.10.19",
"datatables.net-bs": "^1.10.19",
"datatables.net-fixedcolumns": "^3.2.6",
"datatables.net-fixedcolumns-bs": "^3.2.6",
"datatables.net-fixedheader": "^3.1.5",
"datatables.net-fixedheader-bs": "^3.1.5",
"datatables.net-select": "^1.2.7",
"datatables.net-select-bs": "^1.2.7",
"font-awesome": "^4.7.0",
"jquery": "^3.3.1",
"jquery-slimscroll": "^1.3.8",
"msgpack-lite": "^0.1.26",
"ng2-dragula": "^2.0.1",
"ngrx-store-localstorage": "^5.0.0",
"ngrx-store-logger": "^0.2.2",
"plotly.js": "^1.39.3",
"primeicons": "^1.0.0-beta.9",
"primeng": "^6.0.0",
"reselect": "^3.0.1",
"rxjs": "5.6.0-forward-compat.5",
"select2": "^4.0.6-rc.1",
"three": "^0.101.1",
"three-orbit-controls": "^82.1.0",
"three-ply-loader": "^1.0.0",
"three-stl-loader": "^1.0.6",
"zone.js": "^0.8.29"


},
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.6.8",
    "@angular/cli": "~7.3.1",
    "@angular/compiler-cli": "~7.2.5",
    "@angular/language-service": "~7.2.5",
    "@types/autobahn": "^0.9.39",
    "@types/jasmine": "^2.8.16",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^10.12.26",
    "codelyzer": "~4.5.0",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.1.4",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "^2.0.1",
    "karma-jasmine": "^1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "^5.4.2",
    "rxjs-tslint": "^0.1.5",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~3.2.4"
  }
  

и следующий код в одном из моих компонентов:

 import { Observable, Subscription as rxjsSubscription, combineLatest, 
merge } from 'rxjs';

@Component({
    templateUrl: './file-exchange.component.html',
    styleUrls: ['./file-exchange.component.scss']
})
export class FileExchangeComponent implements OnInit, OnDestroy {

...

rxjsSubscriptions: rxjsSubscription = new rxjsSubscription();

...

ngOnInit(): void {

// Storage space subscription
    this.rxjsSubscriptions.add(
        this.store.select(root.fileXSpace)
            .subscribe((space: { bytesAllowed: number, bytesUsed: number }) => {
                this.bytesAllowed = space.bytesAllowed;
                this.bytesUsed = space.bytesUsed;
                // Careful not to do division by zero
                this.bytesPercentage = space.bytesAllowed > 0 ? 100 * space.bytesUsed / space.bytesAllowed : 0;
            })
    );
  

он работает с Angular 6, но больше не работает, поскольку я обновился до angular 7, получая следующую ошибку:

main.73926b0c96716431d554.js:1 ОШИБКА Ошибка: Не перехвачено (в обещании): ошибка ссылки: rxjsSubscription не определена Ошибка ссылки: rxjsSubscription не определена в новом CA (main.73926b0c96716431d554.js: 1) в wv (main. 73926b0c96716431d554.js: 1) в bv (main.73926b0c96716431d554.js: 1) в Jv (main.73926b0c96716431d554.js:1) в Yv (main.73926b0c96716431d554.js:1) в Wy (main.73926b0c96716431d554.js: 1) в Object.my [как createRootView] (main.73926b0c96716431d554.js: 1) в Hg.create (main.73926b0c96716431d554.js:1) в ws.create (main.73926b0c96716431d554.js: 1) в qg.createComponent ( main.73926b0c96716431d554.js: 1) в j (polyfills.57411ef973d8af233f6e.js:1) в j (polyfills.57411ef973d8af233f6e.js:1) в polyfills.57411ef973d8af233f6e.js:1) в e.invokeTask (polyfills.57411ef973d8af233f6e.js: 1) в Object.onInvokeTask (main.73926b0c96716431d554.js: 1) в e.invokeTask (polyfills.57411ef973d8af233f6e.js:1) в t.RunTask (polyfills.57411ef973d8af233f6e.js:1) в y (polyfills.57411ef973d8af233f6e.js:1) в t. invokeTask [как вызов] (polyfills.57411ef973d8af233f6e.js:1) в _ (polyfills.57411ef973d8af233f6e.js:1)

Я пытался изменить версию библиотеки «rxjs»: «5.6.0-forward-compat.5», как предлагается в некоторых сообщениях (5, 6.2.1., 6.4 и многих других), но ошибка просто не исчезает.

Извините, что повторяюсь, но я хочу убедиться, что следующее сообщение будет передано:

ПОЖАЛУЙСТА, ОБРАТИТЕ ВНИМАНИЕ, ЧТО ОШИБКА ВОЗНИКАЕТ ТОЛЬКО ТОГДА, КОГДА я СОЗДАЮ приложение И ЗАПУСКАЮ ЕГО с СЕРВЕРА. ОН ОТЛИЧНО РАБОТАЕТ, ЕСЛИ я ЗАПУСКАЮ НА LOCALHOST.

Комментарии:

1. Пожалуйста, обновите пакет @angular-devkit / build-angular до текущей версии 0.12.1 github.com/angular/angular/issues/28123

Ответ №1:

Попробуйте использовать этот код:

 import { Observable, Subscription, combineLatest, merge } from 'rxjs';

rxjsSubscriptions: Subscription[] = [];

this.rxjsSubscriptions.push(
    //
);

ngOnDestroy() {
   this.rxjsSubscriptions.forEach(sub => sub.unsubscribe());
}
  

Комментарии:

1. ГЕНИАЛЬНО… Большое вам спасибо, Дмитрий Гринько