Angular，使用存储元素调用 ngOnInit 中的方法（订阅）

Question

使用商店，我订阅了特定商品的所有更改。 我想在角度组件（ng-terminal）中输出这些更改（终端消息）。 代码完成向我建议了 write 方法。这也适用于 ngOnInit() 之外。通过控制台的输出有效。该控件也存在（this.terminal != null）。

H

import {AfterViewInit, Component, Input, OnInit, ViewChild,} from '@angular/core';
import { select, Store } from '@ngrx/store';
**import { NgTerminal } from 'ng-terminal';**
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { terminalSelector } from 'src/app/stores/terminal/terminal.selectors';

@Component({
    selector: 'simu-terminal',
    templateUrl: './terminal.component.html',
    styleUrls: ['./terminal.component.scss'],
})
export class TerminalComponent implements OnInit, AfterViewInit {
    @Input() content: TerminalComponent;
    @ViewChild('term', { static: true }) terminal: NgTerminal;

    private readonly unsubscribe$ = new Subject<void>();

    constructor(private readonly store: Store) {}

    ngOnInit(): void {
        this.store
            .pipe(select(terminalSelector), takeUntil(this.unsubscribe$))
            .subscribe((msg) => {
                console.log(msg.message);
                if (this.terminal != null) {
                    this.terminal.write(msg.message);
                }
            });
    }

   ngAfterViewInit() {
        this.terminal.keyEventInput.subscribe((e) => {
            console.log('keyboard event:' + e.domEvent.keyCode + ', ' + e.key);
            const ev = e.domEvent;
            const printable = !ev.altKey && !ev.ctrlKey && !ev.metaKey;
            if (ev.keyCode === 13) {
                this.terminal.write('\r\n$ ');
            } else if (ev.keyCode === 8) {
                if (this.terminal.underlying.buffer.active.cursorX > 2) {
                    this.terminal.write('\b \b');
                }
            } else if (printable) {
                this.terminal.write(e.key);
            }
        });
    }
}

但在 ngOnInit 内部，我收到以下消息：

core.js:6498 ERROR TypeError: Cannot read properties of undefined (reading 'write')
    at NgTerminalComponent.write (ng-terminal.js:241)
    at SafeSubscriber._next (terminal.component.ts:33)
    at SafeSubscriber.__tryOrUnsub (Subscriber.js:183)
    at SafeSubscriber.next (Subscriber.js:122)
    at Subscriber._next (Subscriber.js:72)
    at Subscriber.next (Subscriber.js:49)
    at TakeUntilSubscriber._next (Subscriber.js:72)
    at TakeUntilSubscriber.next (Subscriber.js:49)
    at DistinctUntilChangedSubscriber._next (distinctUntilChanged.js:50)
    at DistinctUntilChangedSubscriber.next (Subscriber.js:49)

我做错了什么？

Answer 1

您可以在属性名称和下一个属性之间的句点之间插入一个?：

this.terminal?.write('\b \b');