[解決済み] Angular 4+ ngOnDestroy() サービス中 - observableを破壊する
2022-08-16 05:35:50
質問
angularアプリケーションでは
ngOnDestroy()
のライフサイクルフックがあり、このフックを使って observable の登録を解除します。
で作成された観測物を消去/破棄したいのですが、どうすればよいでしょうか?
@injectable()
サービス内に作成されたobservableを消去/破棄したいのです。
いくつかの書き込みを見たところ
ngOnDestroy()
はサービス内でも使えるという書き込みを見ました。
しかし、それは良い習慣で、そうする唯一の方法なのでしょうか? 誰か教えてください。
どのように解決するのですか?
オンデストロイ のライフサイクルフックはプロバイダで利用可能です。 ドキュメントによると
ディレクティブ、パイプ、サービスが破棄されるときに呼ばれるライフサイクルフックです。
ここでは の例です。 :
@Injectable()
class Service implements OnDestroy {
ngOnDestroy() {
console.log('Service destroy')
}
}
@Component({
selector: 'foo',
template: `foo`,
providers: [Service]
})
export class Foo implements OnDestroy {
constructor(service: Service) {}
ngOnDestroy() {
console.log('foo destroy')
}
}
@Component({
selector: 'my-app',
template: `<foo *ngIf="isFoo"></foo>`,
})
export class App {
isFoo = true;
constructor() {
setTimeout(() => {
this.isFoo = false;
}, 1000)
}
}
上のコードで
Service
に属するインスタンスです。
Foo
コンポーネントに属するインスタンスなので
Foo
が破壊されたときに破壊されます。
ルートインジェクタに属するプロバイダでは、アプリケーションの破棄時に発生します。これは、テストなどで複数のブートストラップによるメモリリークを回避するのに役立ちます。
親インジェクタのプロバイダが子コンポーネントで購読されている場合、それはコンポーネント破棄時に破棄されません。
ngOnDestroy
(に登録解除する必要があります(別の回答で説明されています)。
関連
-
[解決済み] Angular HTMLバインディング
-
[解決済み] BehaviorSubjectとObservableの違い?
-
[解決済み] Angular/RxJS `Subscription` からいつ退会すればいいのか?
-
[解決済み] ng buildの後にangular-cliのdist-folderのパスを変更するには?
-
[解決済み] ng serve がファイルの変更を自動的に検出しない
-
[解決済み] Angular 2: 反応するフォームコントロールの反復処理
-
[解決済み] Angular Materialでのデフォルトのソート - ヘッダーのソート
-
[解決済み] angular-cliのビルドでカスタムファイルをインクルードするには?
-
[解決済み] .tsファイルはTypeScriptのコンパイルの一部ですが、使用されていませんという警告を消すには?
-
[解決済み] AngularでFormArrayからすべての項目を削除する
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Angular/RxJS `Subscription` からいつ退会すればいいのか?
-
[解決済み] ng buildの後にangular-cliのdist-folderのパスを変更するには?
-
[解決済み] ng serve がファイルの変更を自動的に検出しない
-
[解決済み] Angular 4/5/6 グローバル変数
-
[解決済み] formControlNameとFormControlの違いは何ですか?
-
[解決済み] angular-cliのパラメータ --base-href と --deploy-url の違いは何ですか?
-
[解決済み] Angular 2のFormGroupからすべての検証エラーを取得する
-
[解決済み] Angular2でNgForがPipeでデータを更新しない。
-
[解決済み] Angular / Angular Materialでmat-horizontal-stepperのステップをプログラムで移動させることは可能ですか?
-
[解決済み] 文字列|ヌル'型の引数は、文字列'型のパラメータに代入できません。タイプ 'null' はタイプ 'string' に割り当てられません。