に反映これは私のDataServiceある:角度2 BehaviorSubjectデータ操作サービス
private resultsChanged$: BehaviorSubject<Test[]> =
new BehaviorSubject<any>([]);
constructor(private http: Http) { }
public getLatestTrends(): Observable<Test[]> {
const latestUrl = `api/tests/trends/groupname=${this.group}&name=${this.team}`;
return this.http.get(this.baseUrl + latestUrl)
.switchMap((res) => {
const json = res.json();
console.log(json);
this.resultsChanged$.next(json as Test[]);
return json;
});
}
public getSubject(): Observable<Test[]> {
return this.resultsChanged$.asObservable();
}
これはのDataServiceを使用して、返されたデータをフォーマットする成分である。
private latestTests: Test[];
private subscription: Subscription;
constructor(private testDataService: TestDataService) { }
ngOnInit() {
this.subscription = this.testDataService.getSubject()
.subscribe((res) => {
if (res === undefined || res.length < 1) {
return;
}
this.latestTests = this.getFormattedTests(res.reverse());
});
}
getFormattedTests(trends) {
let formattedTests = [];
if (trends === undefined || trends === null) {
return formattedTests;
}
formattedTests = trends.map((trend) => {
if (this.isPassed(trend.ran, trend.passed, trend.total)) {
trend.state = 'check_circle';
trend.color = 'green';
} else {
trend.state = 'warning';
trend.color = 'red';
}
const ranPercent = this.getFixedPercent(trend.ran, trend.total);
const passPercent = this.getFixedPercent(trend.passed, trend.ran);
const failPercent = this.getFixedPercent(trend.failed, trend.ran);
trend.notRun = trend.total - trend.ran;
trend.ran = `${trend.ran} (${ranPercent})`;
trend.passed = `${trend.passed} (${passPercent})`;
trend.failed = `${trend.failed} (${failPercent})`;
return trend;
});
return formattedTests;
}
HTML
<tr *ngFor="let test of latestTests">
<td>
<span><md-icon [ngStyle]="getStateOfBuild(test)">{{test.state}}</md-icon> {{test.versionString}}</span>
</td>
<td>{{test.total}}</td>
<td>{{test.ran}}</td>
<td>{{test.passed}}</td>
<td>{{test.failed}}</td>
<td>{{test.notRun}}</td>
<td></td>
<td>{{test.duration | duration }}</td>
</tr>
さて、サイトが読み込まれると、データはフォーマットされ、latestTests変数に保存されます。私のルートの間を循環してngInitが再び呼び出されると、データは再びフォーマットされ、私は理解しません。奇妙なことは、私がconsole.log(json); DataServiceでは、元のデータではなくフォーマットされたデータをログアウトします...それはどのように可能ですか? BehaviorSubjectのデータが何らかの形で変更されているかのようです。私は何が欠けていますか?
明確にする必要がある場合は、お手伝いし、コメントしてください。件名とBehaviorSubjectの差の
'BehaviorSubject'は受信した最新の値を保存し、サブスクリプションですべてのオブザーバーにそれを再生します。 – martin
それはそうするはずですが、最新の値は、コンポーネントがngOnInitでフォーマットするときに変更されるようです。コンポーネントは、そのようなサブジェクトデータを操作できませんか? –
配列の同じインスタンスを操作していませんか?たぶん 'this.resultsChanged $ .next(Array.from(json));' – martin