相关疑难解决方法(0)

Angular 2 - 在模型更改后查看未更新

我有一个简单的组件,它每隔几秒就调用一次REST api并收回一些JSON数据.我可以从我的日志语句和网络流量中看到返回的JSON数据正在发生变化,我的模型正在更新,但是视图没有变化.

我的组件看起来像:

import {Component, OnInit} from 'angular2/core';
import {RecentDetectionService} from '../services/recentdetection.service';
import {RecentDetection} from '../model/recentdetection';
import {Observable} from 'rxjs/Rx';

@Component({
    selector: 'recent-detections',
    templateUrl: '/app/components/recentdetection.template.html',
    providers: [RecentDetectionService]
})



export class RecentDetectionComponent implements OnInit {

    recentDetections: Array<RecentDetection>;

    constructor(private recentDetectionService: RecentDetectionService) {
        this.recentDetections = new Array<RecentDetection>();
    }

    getRecentDetections(): void {
        this.recentDetectionService.getJsonFromApi()
            .subscribe(recent => { this.recentDetections = recent;
             console.log(this.recentDetections[0].macAddress) });
    }

    ngOnInit() {
        this.getRecentDetections();
        let timer = Observable.timer(2000, 5000);
        timer.subscribe(() => this.getRecentDetections());
    }
}
Run Code Online (Sandbox Code Playgroud)

我的观点看起来像:

<div class="panel panel-default">
    <!-- Default panel contents --> …
Run Code Online (Sandbox Code Playgroud)

angular

111
推荐指数
4
解决办法
17万
查看次数

角度2变化检测与可观察量

我通常设法在浏览现有问题时发现我做错了什么,但在这里,没有任何帮助.

我正在使用一个简单的Ng2模块,它试图列出并更新NeDB存储的内容.

请注意,我对NeDB商店没有任何问题,我已经确认它已正确更新,并且最初正确加载,因此我遇到的问题在其他地方.

我遇到的问题如下:

"异步管道不起作用".


我有这个模块.

@NgModule({
    imports: [CommonModule],
    exports: [],
    declarations: [WikiComponent],
    providers: [WikiDbService],
})
export class WikiModule { }
Run Code Online (Sandbox Code Playgroud)

我有这个组件.

@Component({
    selector: 'wiki',
    templateUrl: './wiki.component.html'
})
export class WikiComponent implements OnInit {

    items: Observable<WikiItem[]>;

    constructor(private _db : WikiDbService) { }

    ngOnInit() {
        this.items = this._db.items;
        this.items.subscribe({
            next: x => console.log("got value", x),
            error: e => console.error("observable error", e),
            complete: () => console.log("done")
        });
    }
}
Run Code Online (Sandbox Code Playgroud)

我有这个模板.

<p>{{items | async | json}}</p>
<ul>
    <li *ngFor="let item of (items | …
Run Code Online (Sandbox Code Playgroud)

asynchronous observable rxjs typescript angular

6
推荐指数
1
解决办法
9641
查看次数

标签 统计

angular ×2

asynchronous ×1

observable ×1

rxjs ×1

typescript ×1