相关疑难解决方法(0)

我应该何时存储Subscription实例并unsubscribe()在NgOnDestroy生命周期中调用,何时可以忽略它们？

保存所有订阅会在组件代码中引入很多混乱.

HTTP客户端指南忽略这样的订阅:

getHeroes() {
  this.heroService.getHeroes()
                   .subscribe(
                     heroes => this.heroes = heroes,
                     error =>  this.errorMessage = <any>error);
}

同时," 航线与导航指南"说:

最终,我们会在其他地方导航.路由器将从DOM中删除此组件并将其销毁.在此之前我们需要自己清理.具体来说,我们必须在Angular破坏组件之前取消订阅.如果不这样做可能会造成内存泄漏.

我们取消订阅我们Observable的ngOnDestroy方法.

private sub: any;

ngOnInit() {
  this.sub = this.route.params.subscribe(params => {
     let id = +params['id']; // (+) converts string 'id' to a number
     this.service.getHero(id).then(hero => this.hero = hero);
   });
}

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

在我的应用程序中,我有一些通过的方式进行通信的组件 EventService.

@Injectable()
export class EventService {
  public myEvent: EventEmitter<any> = new EventEmitter();
  constructor() {}
}

EmitterComponent当单击按钮时,此服务将注入一个发出事件的服务

@Component({
  selector: 'emitter',
  template: `<button (click)="onClick()">Click me</button>`,
})
export class EmitterComponent {
  constructor(private eventService:EventService) {}
  onClick() {
    this.eventService.myEvent.emit();
  }
}

并且在ReceiverComponent订阅事件中并且对于每个收到的事件增加一个计数器

@Component({
  selector: 'receiver',
  template: `Count: {{count}}`,
})
export class ReceiverComponent {
  public count = 0;
  constructor(private eventService:EventService) {
    this.eventService.myEvent.subscribe(() => this.count++;);
  }
}

该应用程序有多个视图(在这个例子中只有两个):PageA和PageB.EmitterComponent并且ReceiverComponent在PageA.每次进入PageB并返回时PageA, …

我有一个角度4.3.5应用程序,它使用一段时间后变得更慢(约20分钟).

我的情景如下:

• 在RaspberryPi B 3上运行的Rest API和静态角度html/css/js
• ~30 RaspberryPI B 3通过Chromium(版本58和60)访问静态角度应用

发生了什么:

• Angular的HTTP请求在时间过后变慢.示例:从~100 ms到~2秒

附加信息:

• 如果我在Chromium上按F5,Angular应用程序将恢复正常
• Angular使用此模板https://themeforest.net/item/primer-angular-2-material-design-admin-template/19228165
• Angular使用我编写的Google Chrome/Chromium应用程序,通过串口与Arduino进行通信(Chrome API:chrome.runtime.sendMessage,chrome.runtime.connect和chrome.serial)
• 当应用程序变慢时,客户端RaspberryPi具有可用资源(CPU和内存)
• Angular应用程序几乎不存储浏览器

提出问题的组件如下:

import { Component, OnInit, OnDestroy } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import 'rxjs/add/operator/takeUntil';
import { Subject } from 'rxjs/Subject';

import { SweetAlertService } from 'ng2-cli-sweetalert2';

import { ApiService } from '.././api.service';
import { NFCService } from '.././nfc.service';

@Component({
  selector: 'app-menu',
  templateUrl: './menu.component.html',
  styleUrls: ['./menu.component.scss']
})
export class MenuComponent implements OnInit, OnDestroy {

  private …

我的 Angular 应用程序有很多组件，其中之一是 MyComponent，其组件类如下所示：

import { Component, OnInit } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/interval';

@Component({
  selector: 'app-my',
  templateUrl: './my.component.html',
  styleUrls: ['./my.component.scss']
})
export class MyComponent implements OnInit {
  a = 'I still alive';
  constructor() {}

  ngOnInit() {
    Observable.interval(1000).subscribe(x => console.log(this.a));
  }
}

如果我访问 MyComponent，订阅将按预期开始。假设我现在离开 MyComponent，并且 MyComponent 现在应该被销毁。但我仍然可以看到订阅仍然存在（控制台日志不断出现）。在主机组件 (MyComponent) 被销毁后允许订阅继续存在有什么实际好处？

（如果我想取消订阅，可以在MyComponent的ngOnDestroy()方法中进行，但如何取消订阅不是这里讨论的重点）

我知道 Ionic 事件将在下一个版本中被弃用。目前，我使用事件从子组件执行父页面中的函数。下面是一个例子：

在我的主页中，它订阅了要刷新的事件：

constructor(){
  this.eventFormRefresh = (obj) => {
    this.fetch(obj.isReset);
  };
  this.events.subscribe('form:refresh', this.eventFormRefresh);
}

ngOnDestroy(): void {
  this.events.unsubscribe('form:refresh', this.eventFormRefresh);
}

在子组件中，我通过发布 'form:refresh' 事件来激活刷新，如下所示：

this.events.publish('form:refresh');

我将如何使用 angular observables 执行上述操作？