web-dev-qa-db-fra.com

Angular4 Charger une page HTML externe dans un div

J'avais une application dans angular1 et j'utilisais jQuery pour charger une page externe dans mon élément HTML . Voici le code HTML de mon élément conteneur:

<div id="externalContainer" class="text-center">
</div>

J'ai utilisé le script suivant pour charger la page externe.

$( "#externalContainer" ).load( myExternalPageLink );

Maintenant, cela ne semble pas fonctionner dans angular4, les experts peuvent-ils me guider, comment puis-je obtenir cette fonctionnalité dans angular4?

angulartypescriptecmascript-6
6
Awais Ashraf

Vous pouvez utiliser [innerHtml] quelque chose comme

<div [innerHtml]="myTemplate">
</div>

Dans votre composant

export public class MyComponent {
    private myTemplate: any = "";
    constructor(http: Http) {
        http.get(myExternalPageLink).map((html:any) => this.myTemplate = html);
    }
}
8
jitender

Je sais que je suis un peu en retard pour le parti, mais je suis tombé sur cette question en essayant de résoudre mon propre problème et je voulais le partager au cas où quelqu'un d'autre aurait le même problème.

J'essayais également de permettre l'utilisation de composants personnalisés dans notre code HTML externe pour notre blog.

J'ai tout documenté sur notre blog (générer dynamiquement des composants angulaires à partir de html externe) .

Espérons que cela soit modérément utile pour la prochaine personne qui l’a rencontré.

2
Amos47