Question

我想添加单击功能以锚定需要从对象数组中获取的标记。有什么办法只能从对象数组中获取html内容吗？

这是我得到的示例响应的示例。我想从此处从每个对象以及每个“ faq_answer” 中获取“ faq_answer” ，我想获取 anchor标签并添加一个该 anchor标签的onclick功能。

{
 "result_status": true,
 "data": [
   {
    "faq_id": "84",
    "language": "0",
    "faq_question": "Question1",
    "faq_answer": "<p>From Sunday to Thursday, 9 am to 5.30 pm (UAE time).</p>\r\n",
    "display_order": "0",
    "is_active": "1"
  },
  {
    "faq_id": "89",
    "language": "0",
    "faq_question": "Question 2",
    "faq_answer": "<p>Google. For more information visit the website <a href=\"https://www.google.com/\">www.google.com</a></p>\r\n",
    "display_order": "0",
    "is_active": "1"
  },
  {
    "faq_id": "84",
    "language": "0",
    "faq_question": "Question1",
    "faq_answer": "<p>From Sunday to Thursday, 9 am to 5.30 pm (UAE time).</p>\r\n",
    "display_order": "0",
    "is_active": "1"
  },
  {
    "faq_id": "89",
    "language": "0",
    "faq_question": "Question 2",
    "faq_answer": "<p>Google. For more information visit the website <a href=\"https://www.google.com/\">www.google.com</a></p>\r\n",
    "display_order": "0",
    "is_active": "1"
  },
 ]
}

faq.html

这是我正在显示它的模板文件。

<ion-list *ngIf="item.faq_answer && item.open" no-lines class="faq_lst" [ngClass]="{'rtl': item.language!='0', 'ltr': item.language=='0'}">
  <div>
    <p [innerHTML]="item.faq_answer | safeHtml"></p>
  </div>
</ion-list>

Answer 1

您只需将点击事件监听器放在您的rbindlist2 <- function(L, ..., .names) { if (missing(.names)) .names <- colnames(L[[1]]) L <- lapply(L, function(x) subset(x, select = .names)) data.table::rbindlist(L, ...) } rbindlist2(list(data.table(a=1,b=2,d=4), data.table(a=4,b=5,c=6)), .names = c("a", "b")) # a b # 1: 1 2 # 2: 4 5标记中

<p>

然后在您的点击事件监听器中：

<ion-list *ngIf="item.faq_answer && item.open" no-lines class="faq_lst" [ngClass]="{'rtl': item.language!='0', 'ltr': item.language=='0'}">
  <div>
    <p [innerHTML]="item.faq_answer | safeHtml"
       (click)="onAnswerClicked($event)">
    </p>
  </div>
</ion-list>

希望有帮助

Answer 2

HTML代码：-

<div (click)="elementClicked($event)" id="dataContainer">
  <div *ngFor="let item of values.data" [innerHTML]="item.faq_answer | safeHtml"></div>
</div>

TypeScript代码：-

import { Component } from '@angular/core';
import sdk from '@stackblitz/sdk';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  public values = {
 "result_status": true,
 "data": [
   {
    "faq_id": "84",
    "language": "0",
    "faq_question": "Question1",
    "faq_answer": "<p>From Sunday to Thursday, 9 am to 5.30 pm (UAE time).</p>\r\n",
    "display_order": "0",
    "is_active": "1"
  },
  {
    "faq_id": "89",
    "language": "0",
    "faq_question": "Question 2",
    "faq_answer": "<p>Google. For more information visit the website <a href=\"https://www.google.com/\">www.google.com</a></p>\r\n",
    "display_order": "0",
    "is_active": "1"
  },
  {
    "faq_id": "84",
    "language": "0",
    "faq_question": "Question1",
    "faq_answer": "<p>From Sunday to Thursday, 9 am to 5.30 pm (UAE time).</p>\r\n",
    "display_order": "0",
    "is_active": "1"
  },
  {
    "faq_id": "89",
    "language": "0",
    "faq_question": "Question 2",
    "faq_answer": "<p>Google. For more information visit the website <a href=\"https://www.google.com/\">www.google.com</a></p>\r\n",
    "display_order": "0",
    "is_active": "1"
  },
 ]
}

public elementClicked(event) {
  var elem = event.target;
  alert(elem);
  if(elem.tagName.toLowerCase() === 'a') {
    //perform your logic
  }
}
}

有没有办法从对象数组中获取HTML内容？

2 个答案: