如何在 Ionic 4 中获取变量中的 div 值

Question

我正在使用 Ionic 4，我想获取 div 中的文本，下面是 home.page.html

的代码

<ion-item>
    <div id="Target" class="editable"  [innerHtml]="resume" contenteditable>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
      </div>
     <br>
</ion-item>

<br>
<button ion-button (click)="fetch_div()">Fetch Div Value</button>
</ion-content>

home.page.ts

fetch_div(){
    //code to fetch the value of div
    var ElementClass = document.getElementById("Target").className;
    console.log("---");
    console.log(ElementClass);
}

单击 Fetch Div Value，我想获取 div 中的所有内容，如下所示 div 的示例屏幕截图：

我怎样才能做到这一点？

Answer 1

使用ElementRef,

app.component.html :

<div #test>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</div>

app.component.ts :

import { ElementRef, ViewChild } from '@angular/core';

@ViewChild("test") testdiv: ElementRef;
// For angular 8+, @ViewChild("test", {static: false}) testdiv: ElementRef;

fetch_div(){
    console.log(this.testdiv.nativeElement.innerHTML);
    console.log(this.testdiv.nativeElement.innerText);
}

演示：https://stackblitz.com/edit/angular-8v6mod

如何在 Ionic 4 中获取变量中的 div 值

How to fetch the div value in a variable in Ionic 4

javascript

ionic-framework

angular

ionic4