Angular 可观察到角度2第一次未开火

你好

从RC5更新到最新版本后，Angular2出现了一个小问题。 我正在使用服务在组件之间进行通信。该服务公开了一个可观察对象以允许订阅，并在

app.module

中声明。在控制台中，它似乎包含第一次单击的数据以及可用的订阅者

现在，当我单击调用fetch方法的组件上的按钮时，什么也没有发生。但是，如果我再次单击它，结果将成功显示。我在网上搜索过，但找不到答案

对于angular2 rc5，在更新之前，相同的代码一直在按预期工作

服务的部件：

items: Observable<Array<Object>>;
private _data: BehaviorSubject<Array<Object>>;

constructor(private http: Http) {
    this._data = new BehaviorSubject(null);
    this.items = this._data.asObservable();
}

fetch(text: String) {
    this.text = text;
    let headers = new Headers();
    headers.append("Content-Type", "application/json");
    let options = new RequestOptions({ headers: headers });
    this.http.post(this._url, "...{}...", options)
        .map((res: Response) => res.json())
        .subscribe(data => {
            this._data.next(Object.assign([], data).items);
        }, error => this.handleError(error));
}

项目：可观察；
私有数据：行为主体；
构造函数（专用http:http）{
此._data=new BehaviorSubject（null）；
this.items=this._data.asObservable（）；
}
获取（文本：字符串）{
this.text=文本；
let headers=新的headers（）；
headers.append（“内容类型”、“应用程序/json”）；
let options=newrequestoptions（{headers:headers}）；
this.http.post（this.uURL，“…{}…”，选项）
.map（（res:Response）=>res.json（））
.订阅（数据=>{
this.\u data.next（Object.assign（[]，data）.items）；
}，error=>this.handleError（error））；
}

应在其中更新的组件代码。（顺便说一句，组件位于

内部）

组件：
私有数据：数组；
恩戈尼尼特（）{
this.fetchService.items.subscribe（结果=>{
这个数据=结果；
});
}

---

有谁能解释出什么地方出了问题？

这看起来像是angular2中的一只虫子。我也有类似的问题，我找到了解决办法。给你

component:
private data: Array<Object>;

constructor(private changeDetectorRef: ChangeDetectorRef) { }

ngOnInit() {
    this.fetchService.items.subscribe(result => {
        this.data = result;
        this.changeDetectorRef.detectChanges();
    });
}

组件：
私有数据：数组；
构造函数（私有changeDetectorRef:changeDetectorRef）{}
恩戈尼尼特（）{
this.fetchService.items.subscribe（结果=>{
这个数据=结果；
this.changeDetectorRef.detectChanges（）；
});
}

数据更改后，您必须手动注入changeDetector和fire change detection

---

希望有帮助；）

控制台中有错误吗？为什么要使用

行为子对象

？没有，我没有收到任何错误，在控制台和网络选项卡中，我可以看到请求和返回的数据。是的，我确实使用了BehaviorSubject。按钮与调用

this.fetchService.items.subscribe（…）

的代码有什么关系。你为什么提到这个按钮？“它应该做什么？”AngularFrance，很抱歉一开始没有意识到你的问题。因此，由于组件可能在服务之后初始化，因此BehaviorSubject将确保该组件（无论何时初始化）将接收最后更新的数据。Günter，按钮接收用户输入并将其传递给服务以发出post请求。用户输入是请求正文中JSON对象的一部分。

component:
private data: Array<Object>;

constructor(private changeDetectorRef: ChangeDetectorRef) { }

ngOnInit() {
    this.fetchService.items.subscribe(result => {
        this.data = result;
        this.changeDetectorRef.detectChanges();
    });
}