2016-06-16 3 views
22

Я создаю простой пользовательский интерфейс, используя угловой Метеор 2.Попытки использовать разрушенный вид: detectChanges

1) У меня есть верхний компонент NavBar, который имеет кнопку «выход».
2) При нажатии кнопки «Выход» она перенаправляется на «вход».
3) Тогда я вижу эту ошибку в консоли: EXCEPTION: Attempt to use a destroyed view: detectChanges

Исключение:

EXCEPTION: Attempt to use a destroyed view: detectChanges 
browser_adapter.js:77 EXCEPTION: Attempt to use a destroyed view: detectChangesBrowserDomAdapter.logError @ browser_adapter.js:77BrowserDomAdapter.logGroup @ browser_adapter.js:87ExceptionHandler.call @ exception_handler.js:57(anonymous function) @ application_ref.js:265schedulerFn @ async.js:123SafeSubscriber.__tryOrUnsub @ Subscriber.js:225SafeSubscriber.next @ Subscriber.js:174Subscriber._next @ Subscriber.js:124Subscriber.next @ Subscriber.js:88Subject._finalNext @ Subject.js:128Subject._next @ Subject.js:120Subject.next @ Subject.js:77EventEmitter.emit @ async.js:112onError @ ng_zone.js:120onHandleError @ ng_zone_impl.js:66ZoneDelegate.handleError @ angular2-polyfills.js:394Zone.runTask @ angular2-polyfills.js:323ZoneTask.invoke @ angular2-polyfills.js:490 
browser_adapter.js:77 STACKTRACE:BrowserDomAdapter.logError @ browser_adapter.js:77ExceptionHandler.call @ exception_handler.js:59(anonymous function) @ application_ref.js:265schedulerFn @ async.js:123SafeSubscriber.__tryOrUnsub @ Subscriber.js:225SafeSubscriber.next @ Subscriber.js:174Subscriber._next @ Subscriber.js:124Subscriber.next @ Subscriber.js:88Subject._finalNext @ Subject.js:128Subject._next @ Subject.js:120Subject.next @ Subject.js:77EventEmitter.emit @ async.js:112onError @ ng_zone.js:120onHandleError @ ng_zone_impl.js:66ZoneDelegate.handleError @ angular2-polyfills.js:394Zone.runTask @ angular2-polyfills.js:323ZoneTask.invoke @ angular2-polyfills.js:490 
browser_adapter.js:77 Error: Attempt to use a destroyed view: detectChanges 
    at ViewDestroyedException.BaseException [as constructor] (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:3349:23) 
    at new ViewDestroyedException (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:10626:16) 
    at DebugAppView.AppView.throwDestroyedError (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:11277:72) 
    at DebugAppView.AppView.detectChanges (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:11230:18) 
    at DebugAppView.detectChanges (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:11321:44) 
    at ViewRef_.detectChanges (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:11011:65) 
    at http://localhost:3000/app/app.js?hash=323b1216814e80ed467d95bcda255eb217d7c468:2224:23 
    at ZoneDelegate.invokeTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4721:174) 
    at Object.onInvokeTask (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:9393:41) 
    at ZoneDelegate.invokeTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4721:72) 
    ------------- Elapsed: 80 ms; At: Wed Jun 15 2016 20:22:09 GMT-0700 (PDT) ------------- 
    at Object.onScheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5734:30) 
    at ZoneDelegate.scheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4704:57) 
    at Zone.scheduleMacroTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4652:47) 
    at http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4467:37 
    at setTimeout (eval at createNamedFn (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5346:24), <anonymous>:3:37) 
    at new TopNavbarComponent (http://localhost:3000/app/app.js?hash=323b1216814e80ed467d95bcda255eb217d7c468:2221:9) 
    at DebugAppView._View_HomeComponent0.createInternal (HomeComponent.template.js:48:34) 
    at DebugAppView.AppView.create (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:11098:21) 
    ------------- Elapsed: 2 ms; At: Wed Jun 15 2016 20:22:09 GMT-0700 (PDT) ------------- 
    at Object.onScheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5734:30) 
    at ZoneDelegate.scheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4704:57) 
    at Zone.scheduleMicroTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4649:47) 
    at scheduleResolveOrReject (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4928:22) 
    at resolvePromise (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4893:29) 
    at http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4930:25 
    at ZoneDelegate.invokeTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4721:174) 
    at Object.onInvokeTask (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:9393:41) 
    ------------- Elapsed: 0 ms; At: Wed Jun 15 2016 20:22:09 GMT-0700 (PDT) ------------- 
    at Object.onScheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5734:30) 
    at ZoneDelegate.scheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4704:57) 
    at Zone.scheduleMicroTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4649:47) 
    at scheduleResolveOrReject (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4928:22) 
    at ZoneAwarePromise.then (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5011:25) 
    at RuntimeCompiler.resolveComponent (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:40230:14) 
    at DynamicComponentLoader_.loadNextToLocation (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:10788:31) 
    at RouterOutlet.activate (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:26844:26) 
    ------------- Elapsed: 0 ms; At: Wed Jun 15 2016 20:22:09 GMT-0700 (PDT) ------------- 
    at Object.onScheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5734:30) 
    at ZoneDelegate.scheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4704:57) 
    at Zone.scheduleMicroTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4649:47) 
    at scheduleResolveOrReject (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4928:22) 
    at resolvePromise (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4893:29) 
    at http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4877:21 
    at ZoneDelegate.invoke (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4696:161) 
    at Object.onInvoke (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:9402:41) 
    ------------- Elapsed: 0 ms; At: Wed Jun 15 2016 20:22:09 GMT-0700 (PDT) ------------- 
    at Object.onScheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5734:30) 
    at ZoneDelegate.scheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4704:57) 
    at Zone.scheduleMicroTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4649:47) 
    at scheduleResolveOrReject (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4928:22) 
    at resolvePromise (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4893:29) 
    at http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4877:21 
    at ZoneDelegate.invoke (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4696:161) 
    at Object.onInvoke (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:9402:41) 
    ------------- Elapsed: 0 ms; At: Wed Jun 15 2016 20:22:09 GMT-0700 (PDT) ------------- 
    at Object.onScheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5734:30) 
    at ZoneDelegate.scheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4704:57) 
    at Zone.scheduleMicroTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4649:47) 
    at scheduleResolveOrReject (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4928:22) 
    at resolvePromise (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4893:29) 
    at http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4930:25 
    at ZoneDelegate.invokeTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4721:174) 
    at Object.onInvokeTask (http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:9393:41) 
    ------------- Elapsed: 1 ms; At: Wed Jun 15 2016 20:22:09 GMT-0700 (PDT) ------------- 
    at Object.onScheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5734:30) 
    at ZoneDelegate.scheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4704:57) 
    at Zone.scheduleMicroTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4649:47) 
    at scheduleResolveOrReject (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4928:22) 
    at ZoneAwarePromise.then (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5011:25) 
    at http://localhost:3000/packages/modules.js?hash=560db94ec01c0b3e8f499491ffcce7a2ec6c3c5e:26895:53 
    at http://localhost:3000/packages/meteor.js?hash=ae8b8affa9680bf9720bd8f7fa112f13a62f71c3:1105:22 
    at ZoneDelegate.invoke (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4696:161) 
    ------------- Elapsed: 0 ms; At: Wed Jun 15 2016 20:22:09 GMT-0700 (PDT) ------------- 
    at Object.onScheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:5734:30) 
    at ZoneDelegate.scheduleTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4704:57) 
    at Zone.scheduleMicroTask (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4649:47) 
    at scheduleResolveOrReject (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4928:22) 
    at resolvePromise (http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4893:29) 
    at http://localhost:3000/packages/barbatus_angular2-runtime.js?hash=fda9b73362c52e988ad030102a9f58e4d584cda3:4877:21 
    at http://localhost:3000/packages/meteor.js?hash=ae8b8affa9680bf9720bd8f7fa112f13a62f71c3:1105:22BrowserDomAdapter.logError @ browser_adapter.js:77ExceptionHandler.call @ exception_handler.js:60(anonymous function) @ application_ref.js:265schedulerFn @ async.js:123SafeSubscriber.__tryOrUnsub @ Subscriber.js:225SafeSubscriber.next @ Subscriber.js:174Subscriber._next @ Subscriber.js:124Subscriber.next @ Subscriber.js:88Subject._finalNext @ Subject.js:128Subject._next @ Subject.js:120Subject.next @ Subject.js:77EventEmitter.emit @ async.js:112onError @ ng_zone.js:120onHandleError @ ng_zone_impl.js:66ZoneDelegate.handleError @ angular2-polyfills.js:394Zone.runTask @ angular2-polyfills.js:323ZoneTask.invoke @ angular2-polyfills.js:490 
Subscriber.js:229 Uncaught Attempt to use a destroyed view: detectChanges 

топ-navbar.component.ts

"use strict"; 
import {Logger} from "../services/logger.service"; 
import {Component, ChangeDetectionStrategy, ChangeDetectorRef} from '@angular/core'; 
import {User} from "../models/user"; 
import {Router} from '@angular/router-deprecated'; 
import {UserService} from "../services/user.service"; 
import {CORE_DIRECTIVES} from '@angular/common'; 
import {DROPDOWN_DIRECTIVES} from '../../node_modules/ng2-bootstrap'; 

@Component({ 
    selector: 'top-navbar', 
    templateUrl: 'client/top-navbar/top-navbar.html', 
    bindings: [UserService, Logger], 
    directives: [CORE_DIRECTIVES, DROPDOWN_DIRECTIVES] 
}) 

export class TopNavbarComponent { 

    public user:User; 

    public statusDropdown = { 
     isOpen: false 
    }; 

    constructor(private userService:UserService, private router:Router, private logger:Logger, private ref:ChangeDetectorRef) { 
     setTimeout(() => { 
      this.ref.markForCheck(); 
      this.user = this.userService.getLoggedInUser(); 
      this.ref.detectChanges(); 
     }, 0) 
    } 

    logout() { 
     this.logger.warn('[Top Navbar] Logging out the user.'); 
     localStorage.clear(); 
     this.router.navigateByUrl('/login'); 
    } 
} 

и это мой login.component.ts

"use strict"; 
import { Component, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'; 
import { FormBuilder, ControlGroup, Validators } from '@angular/common'; 
import { MeteorComponent } from 'angular2-meteor'; 
import { Router } from '@angular/router-deprecated'; 
import { Logger } from "../services/logger.service"; 

@Component({ 
    selector: 'login', 
    templateUrl: 'client/login/login.html', 
    changeDetection: ChangeDetectionStrategy.OnPush, 
    bindings: [Logger] 
}) 

export class LoginComponent extends MeteorComponent { 

    loginForm:ControlGroup; 
    loginFailed = false; 

    constructor(private _logger:Logger, private _router:Router, private ref:ChangeDetectorRef) { 
     super(); 
     let fb = new FormBuilder(); 
     this.loginForm = fb.group({ 
      username: ["", Validators.required], 
      password: ["", Validators.required] 
     }); 
    } 

    login() { 


     this.call('authenticateUser', this.loginForm.value.username, this.loginForm.value.password, (err, data) => { 

      if (err) { 
       this._logger.error(err); 

      } else { 
       this._logger.info('[Authentication API] ', data); 

       if (data.status != 'LOGIN_SUCCESS') { 
        this.loginFailed = true; 

       } else { 
        this.loginFailed = false ; 
        var user = { 
         id: data.id, 
         name: data.name, 
         role: data.role 
        } 
        localStorage.setItem('user', JSON.stringify(user)); 
        this._router.navigate(['Home']) 
       } 
       //This is required for letting Angular know that something has changed. 
       //Because this part of code runs out of Angular zone. 
       this.ref.markForCheck(); // Mark this component and its children for change detection in next detecting cycle. 
       this.ref.detectChanges(); // Trigger change detection. 

      } 

     }); 
    } 
} 
+0

прокомментировать вызов detectChanges(); функцию и проверить, где ее сгенерировать другую ошибку – mayur

+0

У меня такая же проблема с тем же сценарием. –

ответ

24

У меня такая же проблема, но с гораздо меньшим кодом, я расскажу вам, что может помочь вам решить проблему.

Проблема явно исходит от detectChanges(), поскольку изменения были выполнены и метод, вызванный во время фазы уничтожения компонента.

Поэтому вам нужно сделать свой компонент implements OnDestroy, тогда вам нужно отменить изменения, которые вызывают this.ref.detectChanges(). так что ваш TopNavbarComponent должен быть похож на:

export class TopNavbarComponent implements OnDestroy { 
    // ... your code 

    ngOnDestroy() { 
    this.cdRef.detach(); // try this 
    // for me I was detect changes inside "subscribe" so was enough for me to just unsubscribe; 
    // this.authObserver.unsubscribe(); 
    } 
} 

P.S: Не забудьте unsubscribe() всех наблюдателей, которые вы имеете в своем компоненте! В любом случае, вы должны это сделать, подписки без отмены подписки могут быть основной причиной для сотен вопросов, включая это.

+0

Когда я это сделал, я получил эту ошибку в функции ngOnDestory: console.js: 26 Ошибка ERROR: нечистота (в обещании): TypeError: невозможно прочитать свойство «detach» undefined TypeError: не удается прочитать свойство «отделить» от неопределенного – Jun

+0

Это значит, что у вас может быть неправильное имя вашего предприятия "ChangeDetectorRef"? если у вас есть 'private cdRef: ChangeDetectorRef' в конструкторе, он должен работать. –

+0

Да, у меня это есть в конструкторе моего компонента. – Jun

2

Вы должны получить стоимость подписчика в переменной и отказаться от подписки на тот же var. Пожалуйста, обратитесь к такому же коду

import { Component, OnInit, ChangeDetectionStrategy, ChangeDetectorRef, OnDestroy } from '@angular/core'; 
import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/observable/of'; 
import { Cartservice } from './../cartservice.service'; 
import { ISubscription } from 'rxjs/Subscription'; 



export class CartComponent implements OnInit, OnDestroy { 

private subscription: ISubscription; 
ngOnInit() { 
    this.subscription = this.cartservice.productsObservable.subscribe(cart => { 
     this.cartProducts = cart.products; 
     this.cartTotal = cart.cartTotal; 
     this.changeDetectorRef.detectChanges(); 
    }); 
    } 

ngOnDestroy() { 
    this.subscription.unsubscribe(); 
    } 
} 

Обратите внимание, что я отменил подписку на изменения в методе ngOnDestroy().

16

Только решение, которое работало для меня было:

if (!this.changeDetectionRef['destroyed']) { 
    this.changeDetectionRef.detectChanges(); 
} 
+0

Это тоже единственное решение, которое сработало для меня. Спасибо! – besserwisser

+0

То же самое здесь, спасибо! Хотя я решил добавить личное поле 'isDestroyed' в каждом компоненте, где он был необходим (т. Е. Когда отменить подписку на вещи было недостаточно). Я установил поле true в ngOnDestroy и использовал его вместо того, чтобы пытаться получить доступ к внутреннему полю детектора изменений ref. – dbandstra

3

Вы можете использовать

this.cdref.markForCheck();

вместо this.cdref.detectChanges(); во многих случаях. Но лучший подход - следовать рекомендациям @ Al-Mothafar.

0

В моем случае это была проблема, связанная с асинхронной тестовой настройкой конфигурации компонентов и компиляции.

  1. Неисправный код был особым асинхронной beforeEach() с помощью TypeScript Async/Await
  2. Чтобы заставить его работать, я использую два beforeEach() s, где первые обрабатывает Async с помощью Angular's async(), и second beforeEach() is sync.

Код, вызывающий ошибки ..

beforeEach(async() => { 
    await TestBed.configureTestingModule({ 
     imports: [ 
      BrowserAnimationsModule 
     ], 
     providers: [ 
      { provide: ComponentFixtureAutoDetect, useValue: true }, 
      { provide: OptionsService, useValue: optionServiceMock }, 
     ], 
     declarations: [EventLogFilterComponent], 
     schemas: [NO_ERRORS_SCHEMA] 
    }).compileComponents(); 
    fixture = TestBed.createComponent(EventLogFilterComponent); 
    component = fixture.componentInstance; 
    optionsService = TestBed.get(OptionsService); 
    component.filterElem = jasmine.createSpyObj('filterElem', ['close']); 
    fixture.detectChanges(); 
}); 

фиксировало ...

beforeEach(async(() => { 
    TestBed.configureTestingModule({ 
     imports: [ 
      BrowserAnimationsModule 
     ], 
     providers: [ 
      { provide: ComponentFixtureAutoDetect, useValue: true }, 
      { provide: OptionsService, useValue: optionServiceMock }, 
     ], 
     declarations: [EventLogFilterComponent], 
     schemas: [NO_ERRORS_SCHEMA] 
    }).compileComponents(); 
})); 

beforeEach(() => { 
    fixture = TestBed.createComponent(EventLogFilterComponent); 
    component = fixture.componentInstance; 
    optionsService = TestBed.get(OptionsService); 
    component.filterElem = jasmine.createSpyObj('filterElem', ['close']); 
    fixture.detectChanges(); 
}); 
0

Не так много связан с конкретным вопросом, но я приземлился здесь прибегая к помощи той же ошибке, так что я поделюсь своим обходным путем. Проблема заключалась в том, что я вызывал fixture.detectChanges() внутри fixture.whenStable().then(() => {}) без обертывания теста в пределах функции async.

До:

it('should...',() => { 
    fixture.whenStable().then(() => { 
    fixture.detectChanges(); 
    }); 
}); 

После:

it('should...', async(() => { 
    fixture.whenStable().then(() => { 
    fixture.detectChanges(); 
    }); 
})); 
0

Ну это ответы не помогли мне. Я нашел другое решение.

компонент Ребенок имеет выход, который срабатывает при близко нажимается кнопка

<child-component 
    *ngIf="childComponentIsShown" 
    (formCloseEmitter)="hideChildComponent()" 
></child-component> 

И «hideChildComponent) (» метод в родительском компоненте обнаруживает изменения.

accountSaveDispatched() { 
    this.childComponentIsShown = false; 
    this.cdr.detectChanges(); 
} 

Надеюсь, это поможет кому-то.

0

Моим решением было отказаться от подписки всех наблюдателей.

Подписка:

ngOnInit() { 
    this._currentUserSubscription = this._auth.currentUser.subscribe(currentUser => {}); 
} 

отписку с changeDetector.detach():

ngOnDestroy() { 
    this._currentUserSubscription.unsubscribe(); 
    this._cdRef.detach(); 
} 

Это было necesery на моем коде, я также должен использовать функциональные возможности ChangeDetectorRef, только эти две вещи ishhued мой код без ошибок.

Смежные вопросы