Question

我的服务很简单。

import { Injectable } from '@angular/core';

@Injectable({ providedIn: 'root' })
export class XmlService {
    items$: Subject<Item[]> = new Subject<Item[]>();

    constructor() {
        setTimeout(() => this.items.next([{age: '20'}]), 4000);
    }
}

在app.module.ts和相应的文件中对其进行设置后，我来到app.component.ts，该文件具有以下设置：

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})
export class AppComponent {
    constructor(private xmlService: XmlService) {
        // Try 1. It worked fine
        xmlService.items$.subscribe(items => console.log(items));
    }

    calledFromClick() {
        // Try 2. Does not work at all even though the method is clicked
        this.xmlService.items$.subscribe(items => console.log(items));
    }
}

请问为什么尝试1无效而尝试2无效？我觉得这个问题是另一个问题的重复，但我不知道提出这个问题的正确方法。

依靠您的帮助

Answer 1

编辑：起初，我建议使用ReplaySubject，但是我想最好使用BehaviorBehavior

https://medium.com/@luukgruijs/understanding-rxjs-behaviorsubject-replaysubject-and-asyncsubject-8cc061f1cfc0

您可以使用如下的BehaviorSubject：

<div class="container">
    <button class="btn" id="btn1">1</button>
</div>

BehaviourSubject 会存储其最后一个值，以便即使在调用subscribe方法之前就已经发出了最新值，订阅者也将始终获得最新值。

Subject.subscribe在构造函数外部不起作用

1 个答案: