TransferState provides a shared store that is transferred from the server to client. To use it import BrowserTransferStateModule from the client app module and ServerTransferStateModule from the server app module and TransferState will be available as an Injectable object. PR Close #19134
37 lines
1.0 KiB
TypeScript
37 lines
1.0 KiB
TypeScript
/**
|
|
* @license
|
|
* Copyright Google Inc. All Rights Reserved.
|
|
*
|
|
* Use of this source code is governed by an MIT-style license that can be
|
|
* found in the LICENSE file at https://angular.io/license
|
|
*/
|
|
|
|
import {isPlatformServer} from '@angular/common';
|
|
import {Component, Inject, PLATFORM_ID} from '@angular/core';
|
|
import {StateKey, TransferState, makeStateKey} from '@angular/platform-browser';
|
|
|
|
const COUNTER_KEY = makeStateKey<number>('counter');
|
|
|
|
@Component({
|
|
selector: 'transfer-state-app',
|
|
template: `
|
|
<div>{{counter}}</div>
|
|
`,
|
|
})
|
|
export class TransferStateComponent {
|
|
counter = 0;
|
|
|
|
constructor(@Inject(PLATFORM_ID) private platformId: {}, private transferState: TransferState) {}
|
|
|
|
ngOnInit() {
|
|
if (isPlatformServer(this.platformId)) {
|
|
// Set it to 5 in the server.
|
|
this.counter = 5;
|
|
this.transferState.set(COUNTER_KEY, 50);
|
|
} else {
|
|
// Get the transferred counter state in the client(should be 50 and not 0).
|
|
this.counter = this.transferState.get(COUNTER_KEY, 0);
|
|
}
|
|
}
|
|
}
|