Last active
May 23, 2024 23:33
-
-
Save tbuyle/b72d548fa03ec040780bb5448e9fd8e2 to your computer and use it in GitHub Desktop.
Load external HTML template and append them to the document body (Stimulus.js)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { Controller } from "stimulus" | |
| export default class extends Controller { | |
| connect() { | |
| const templates = this.element.import.querySelectorAll("template"); | |
| templates.forEach(function(template) { | |
| document.querySelector('body').appendChild(template); | |
| }); | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| ... | |
| <link rel="import" href="/path/to/template.html" data-controller="html-template"> | |
| </head> | |
| <body> | |
| ... | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <template> | |
| <div> | |
| Template Content | |
| </div> | |
| </template> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment