Récupérer le contenu d'un élement

Version imprimable

bonjour,

voici mon code:

Code:

1
2
3
4
5
6
7
8
9
 
  <button *ngIf="getIsAdmin()" mat-raised-button color="{{colorBouton}}" (click)="changeEdit()">{{nameBouton}} isadmin?</button>
 
 
<div *ngIf="publication" id="publication" [attr.contenteditable]="modeEdit" class="{{modeEdit ? 'wysi':'null' }}">
  <div *ngFor="let item of publication._embedded.publications">
    <p [innerHTML]="item.htmlPublication"></p>
  </div>
</div>

voici mon ts:

Code:

1
2
3
4
5
6
7
8
 
 
  changeEdit() { //mode editer ou non edition
 
    let updatePublication = document.getElementById( 'publication' );
 
    console.log("====================>>>>>> save !!"+JSON.stringify(updatePublication));
    console.log("====================>>>>>> save !!"+updatePublication);

le résultat est vide ?

Code:

1
2
3
 
=======stringify==>>>>>> save !!{}
wysi.component.ts:56 ====================>>>>>> save !![object HTMLDivElement]

Comment je dois procéder pour récupérer le contenu tout le DOM de publication ?

merci d'avance pour la réponse :)

24/06/2019, 10h55
NoSmoking

Bonjour,
ton soucis n'a rien à voir avec Angular mais avec les bases de l'API DOM.
Il te faut donc d'abord prendre le temps de te pencher sur celle-ci.

Ressource :
↪ document.getElementById.

merci de la réponse,
en retirant le stringify, j'ai un retour de l'objet HTMLDivElement, et en ajoutant un innerHtml j'ai pu avoir son contenu
mais le JSON.stringify aurai pu emettre une erreur puisqu'il qu'il ne renvoie rien(qu'il en peut convertir un htmlDivElement ?

Code:

1
2
3
4
5
6
 
 
wysi.component.ts:55 =======stringify==>>>>>> save !![object HTMLDivElement]
wysi.component.ts:56 ====================>>>>>> save !!<!--bindings={
  "ng-reflect-ng-for-of": "[object Object]"
}--><div _ngcontent-yad-c6="" class="ng-star-inserted"><p _ngcontent-yad-c6=""><h1>texte</h1><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACsAAAApCAIAAAAj90ecAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEvSURBVFhH7ZbBDYMwDEU7S+epGIUbY7AAK3DqAChXDizQCxckBmAB2pDYQFEVf6OqquQvHyA55NnfmFzmX8sIjMDLCP6XYKjc7XpfwpVNXFRKRTDVWTh+iWKMyzppCPpHzsf7cHUfdzRSEJAFriyiF3k1xT2FcIKxDKlnj4GL8XqOu7hggqbb5M0NccIIlKAtwpFdu7zyR6E3AiQgC9b+pxVigoURkAXbGUBV2S0CQgjY9X26hKUcDAABd/77SeeMkBNw0x2rfcoIMcEHC4LYCMVgkBJsLBj66RBsBD4YhARc52TAg0FGwCkKAjVCRCD63rQTWkIgbPX12gINBgEBWZAs73pvQAZDkgD596x3J2AwpAgwdzVGpAjEFgQpjJB04ndlBEbgZQRG4GUE8/wEzMmLq8pQPv4AAAAASUVORK5CYII="></p></div>

il y a t'il un moyen simple de récupérer juste ceci ?

Code:

1
2
 
<div _ngcontent-kka-c6="" class="pageHTML"><h1>textegggg</h1><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACsAAAApCAIAAAAj90ecAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAEvSURBVFhH7ZbBDYMwDEU7S+epGIUbY7AAK3DqAChXDizQCxckBmAB2pDYQFEVf6OqquQvHyA55NnfmFzmX8sIjMDLCP6XYKjc7XpfwpVNXFRKRTDVWTh+iWKMyzppCPpHzsf7cHUfdzRSEJAFriyiF3k1xT2FcIKxDKlnj4GL8XqOu7hggqbb5M0NccIIlKAtwpFdu7zyR6E3AiQgC9b+pxVigoURkAXbGUBV2S0CQgjY9X26hKUcDAABd/77SeeMkBNw0x2rfcoIMcEHC4LYCMVgkBJsLBj66RBsBD4YhARc52TAg0FGwCkKAjVCRCD63rQTWkIgbPX12gINBgEBWZAs73pvQAZDkgD596x3J2AwpAgwdzVGpAjEFgQpjJB04ndlBEbgZQRG4GUE8/wEzMmLq8pQPv4AAAAASUVORK5CYII=">

je me suis dis que en rajoutant une class "pageHtml", il serais plus simple.

je pense avoir trouvé la solution:

Code:

1
2
3
4
5
 
    let updatePublication = document.getElementById( 'publication' );
    //console.log("||||"+updatePublication.innerHTML+"||||");
    let contentHtml = updatePublication.firstElementChild.firstElementChild;
    console.log(contentHtml.innerHTML);