本文整理汇总了TypeScript中@angular/platform-server.PlatformState类的典型用法代码示例。如果您正苦于以下问题:TypeScript PlatformState类的具体用法?TypeScript PlatformState怎么用?TypeScript PlatformState使用的例子?那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。
在下文中一共展示了PlatformState类的5个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: bootstrap
return platform.bootstrapModuleFactory(factory).then((moduleRef: NgModuleRef<{}>) => {
const state: PlatformState = moduleRef.injector.get(PlatformState);
const appRef: ApplicationRef = moduleRef.injector.get(ApplicationRef);
appRef.isStable
.filter((isStable: boolean) => isStable)
.first()
.subscribe((stable) => {
// Fire the TransferState Cache
const bootstrap = moduleRef.instance['ngOnBootstrap'];
bootstrap && bootstrap();
// The parse5 Document itself
const AST_DOCUMENT = state.getDocument();
// Strip out the Angular application
const htmlDoc = state.renderToString();
const APP_HTML = htmlDoc.substring(
htmlDoc.indexOf('<body>') + 6,
htmlDoc.indexOf('</body>')
);
// Strip out Styles / Meta-tags / Title
const STYLES = [];
const SCRIPTS = [];
const META = [];
const LINKS = [];
let TITLE = '';
//let STYLES_STRING = htmlDoc.substring(
//htmlDoc.indexOf('<style ng-transition'),
//htmlDoc.lastIndexOf('</style>') + 8
//);
let STYLES_STRING: string = htmlDoc.indexOf('<style ng-transition') > -1
? htmlDoc.substring(
htmlDoc.indexOf('<style ng-transition'),
htmlDoc.lastIndexOf('</style>') + 8)
: null;
// STYLES_STRING = STYLES_STRING.replace(/\s/g, '').replace('<styleng-transition', '<style ng-transition');
const HEAD = AST_DOCUMENT.head;
let count = 0;
for (let i = 0; i < HEAD.children.length; i++) {
let element = HEAD.children[i];
if (element.name === 'title') {
TITLE = element.children[0].data;
}
if (element.name === 'script') {
SCRIPTS.push(
`<script>${element.children[0].data}</script>`
);
}
// Broken after 4.0 (worked in rc)
// if (element.name === 'style') {
// let styleTag = '<style ';
// for (let key in element.attribs) {
// if (key) {
// styleTag += `${key}="${element.attribs[key]}">`;
// }
// }
// styleTag += `${element.children[0].data}</style>`;
// STYLES.push(styleTag);
// }
if (element.name === 'meta') {
count = count + 1;
let metaString = '<meta';
for (let key in element.attribs) {
if (key) {
metaString += ` ${key}="${element.attribs[key]}"`;
}
}
META.push(`${metaString} />\n`);
}
if (element.name === 'link') {
let linkString = '<link';
for (let key in element.attribs) {
if (key) {
linkString += ` ${key}="${element.attribs[key]}"`;
}
}
LINKS.push(`${linkString} />\n`);
}
}
resolve({
html: APP_HTML,
globals: {
styles: STYLES_STRING,
title: TITLE,
//.........这里部分代码省略.........
示例2: async
WebAppInternals.registerBoilerplateDataCallback('angular', async (request, data) => {
let document,
platformRef: PlatformRef;
// Handle Angular's error, but do not prevent client bootstrap
try {
document = `
<html>
<head>
<base href="/">
</head>
<body>
<app></app>
</body>
</html>
`;
// Integrate Angular's router with Meteor
const url = request.url;
// Get rendered document
platformRef = platformDynamicServer([
{
provide: INITIAL_CONFIG,
useValue: {
// Initial document
document,
url
}
}
]);
const appModuleRef = await platformRef.bootstrapModule(ServerAppModule, {
ngZone: 'noop',
providers: [
{
provide: ResourceLoader,
useValue: {
get: Assets.getText
},
deps: []
}
]
});
const applicationRef: ApplicationRef = appModuleRef.injector.get(ApplicationRef);
await applicationRef.isStable.pipe(
first(isStable => isStable == true)
).toPromise();
applicationRef.tick();
// Run any BEFORE_APP_SERIALIZED callbacks just before rendering to string.
const callbacks = appModuleRef.injector.get(BEFORE_APP_SERIALIZED, null);
if (callbacks) {
for (const callback of callbacks) {
try {
callback();
} catch (e) {
// Ignore exceptions.
console.warn('Ignoring BEFORE_APP_SERIALIZED Exception: ', e);
}
}
}
const platformState: PlatformState = appModuleRef.injector.get(PlatformState);
document = platformState.renderToString();
} catch (e) {
// Write errors to console
console.error('Angular SSR Error: ' + e.stack || e);
} finally {
//Make sure platform is destroyed before rendering
if (platformRef) {
platformRef.destroy();
}
const head = HEAD_REGEX.exec(document)[1];
data.dynamicHead = head;
const body = BODY_REGEX.exec(document)[1];
data.dynamicBody = body;
}
})
示例3: Error
/**
* Inject the State into the bottom of the <head>
*/
inject() {
try {
const document: any = this.state.getDocument();
const transferStateString = JSON.stringify(this.toJson());
const renderer = this.rendererFactory.createRenderer(document, {
id: '-1',
encapsulation: ViewEncapsulation.None,
styles: [],
data: {}
});
const head = document.head;
if (head.localName !== 'head') {
throw new Error(
'Please have <head> as the first element in your document'
);
}
const script = renderer.createElement('script');
renderer.setValue(
script,
`window['TRANSFER_STATE'] = ${transferStateString}`
);
renderer.appendChild(head, script);
} catch (e) {
console.error(e);
}
}
示例4: inject
/**
* Inject the State into the bottom of the <head>
*/
inject() {
try {
const document: any = this.state.getDocument();
const transferStateString = JSON.stringify(this.toJson());
const renderer = this.rendererFactory.createRenderer(document, {
id: '-1',
encapsulation: ViewEncapsulation.None,
styles: [],
data: {}
});
const body = document.body;
const script = renderer.createElement('script');
renderer.setValue(script, `window['TRANSFER_STATE'] = ${transferStateString}`);
renderer.appendChild(body, script);
} catch (e) {
console.log('Failed to append TRANSFER_STATE to body');
console.error(e);
}
}
示例5: function
return function () {
const doc = state.getDocument();
const inlinePrebootCode = getInlinePrebootCode(opts);
addInlineCodeToDocument(inlinePrebootCode, doc, rendererFactory);
};