【问题标题】:how to display information texts when dialog open对话框打开时如何显示信息文本
【发布时间】:2021-02-01 12:12:00
【问题描述】:

我有这个帮助对话框,由于某些原因,我的信息文本在对话框打开后没有立即显示。它仅在我单击该子部分时才开始显示,所以我想知道如何在用户打开对话框后立即显示它。任何建议或帮助将不胜感激。

HTML

//Clicking this will take the user each subsection

<div *ngFor="let subSection of mappedSecSub | async; let last=last">
  <div *ngIf="subSection.parentId == section.id;" (click)="clicked(subSection.id, section.id)">
   <a mat-list-item>{{subSection.name}}
   <mat-divider *ngIf="!last" class="solid"></mat-divider>
   </a>
 </div>
</div>

// This display the informations text

<div class="column right">
   <div *ngFor="let section of targetSectionGroup">
   <h1 *ngIf="section.parentId == null" class="hint">{{section?.name}}</h1>
  </div>
     <div *ngFor="let section of targetSectionGroup">
     <div *ngIf="section.parentId != null">
     <h2 id="s{{section.id}}ss{{section.parentId}}"  class="hint">{{section?.name}}</h2>
    <p class="multi_lines_text" [innerHTML]="section?.text"></p>
  </div>
  </div>
</div>

TS

  mappedSections: BehaviorSubject<any[]> = new BehaviorSubject<any[]>([]);
  mappedSecSub = this.mappedSections.asObservable()
  targetSection: { id, name, parentId, text };
  targetSectionGroup: { id, name, parentId, text }[] = [];

  ngOnInit(): void {
    this.fetchData();
  }

fetchData = () => {
    this.HelpService.getHelp().subscribe(res => {
      this.mappedSections.next(res['res'])
      let newMappedSection = this.mappedSections.getValue()
      for (let i = 0; i < newMappedSection.length; i++) {
        const element = newMappedSection[i];
        if (element.parentId) {
          this.targetSection = element;
          break
        }
      }
    })
  }

  clicked(id, parentId) {
    this.targetSectionGroup = [];
    let data = this.mappedSections.getValue()
    for (let i = 0; i < data.length; i++) {
      if (data[i].parentId == parentId || data[i].id == parentId) {
        this.targetSectionGroup.push(data[i]);
      }
      if (data[i].id === id) {
        this.targetSection = data[i]
      }
    }
    document.querySelector(`#s${id}ss${parentId}`).scrollIntoView({ behavior: 'smooth' })
  }

现在信息文本仅在我单击子部分时显示。我想在帮助对话框打开后立即显示它。

【问题讨论】:

  • 我猜你在收到this.HelpService.getHelp() 的回复后并没有初始化targetSectionGroup。最好使用第一响应数据调用clicked() 函数。
  • @PankajPrakash 嗨...你能告诉我怎么做吗?谢谢

标签: javascript html angular typescript frontend


【解决方案1】:

我想这应该可行

fetchData = () => {
  this.HelpService.getHelp().subscribe(res => {
    this.mappedSections.next(res['res']);

    const response = res['res'];
    this.clicked(response.id, response.parentId);
    let newMappedSection = this.mappedSections.getValue()
    for (let i = 0; i < newMappedSection.length; i++) {
      const element = newMappedSection[i];
      if (element.parentId) {
        this.targetSection = element;
        break
      }
    }
  })
}

【讨论】:

  • 不知道为什么它只显示部分名称,例如“工作区”,仅此而已。它没有显示小节名称和所有文本。知道为什么它不显示吗?谢谢
  • 您能分享一下您的响应结构吗?
猜你喜欢
  • 2010-11-08
  • 1970-01-01
  • 1970-01-01
  • 2018-02-01
  • 1970-01-01
  • 2011-07-02
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多