diff --git a/docs-src/documentation/replacing-content.page.ts b/docs-src/documentation/replacing-content.page.ts index 12853fac..f001c6bf 100644 --- a/docs-src/documentation/replacing-content.page.ts +++ b/docs-src/documentation/replacing-content.page.ts @@ -20,7 +20,7 @@ export default ({ page, nextPage, prevPage, docsMenu }: PageComponentProps) =>

Let's take for example an async scenario where you render a loading indicator then need to replace this loading indicator - with content. + with the loaded content.

${CodeSnippet( 'const loadingIndicator = html`

loading...

`;\n' + @@ -41,13 +41,13 @@ export default ({ page, nextPage, prevPage, docsMenu }: PageComponentProps) => )}

The above example will initially render the - loading message and after 2.5 seconds it will - replace it with the new template content. + loading... text and after 2.5 seconds it will + replace it with the content template.

- The replace method will insert the not yet rendered template + The replace method will insert the not-yet-rendered template nodes in the place in the DOM the target template was rendered. - This means that you can have multiple tags and it will just + This means that you can have multiple tags, and it will just replace them all.

${Heading('Replacing a DOM Element', 'h3')} @@ -75,7 +75,7 @@ export default ({ page, nextPage, prevPage, docsMenu }: PageComponentProps) => 'fetchContent();', 'typescript' )} -

This will have the same effect as an element.

+

This will have the same effect.

${DocPrevNextNav({ prev: prevPage, next: nextPage,