Ich muss ElementRef in untergeordneten Knoten bekommen.

Meine Vorlage

<div #charts *ngFor="let tag of _tags">
  <jqxBulletChart
    style="margin-left: 10px; float: left;"
    [width]='50'
    [height]='350'
    [barSize]='"35%"'
    [labelsFormat]='"c"'
    [title]="''"
    description="{{tag.configuration.name}}"
    [showTooltip]='true'
    [labelsFormatFunction]="labelsFormatFunction"
    [tooltipFormatFunction]="tooltipFormatFunction" [ticks]='ticks'
    [ranges]='tag.value'
    [pointer]='pointer'
    [orientation]="'vertical'"
  >
  </jqxBulletChart>
</div>

Ich rufe an

@ViewChildren('charts') infoCharts: ElementRef;

Und Kind bekommen

for (let chart of this.arrCharts) {
            console.log(chart);
            console.log(chart.nativeElement.lastChild)
            let child: jqxBulletChartComponent = chart.nativeElement.lastChild;
            console.log(child);
            console.log(+this.tags[count].displayValue);
            child.val(+this.tags[count].displayValue || 0);
            // child.val(20);
            count++;
        }

Aber mein "Kind" sollte vom Typ ElementRef sein, und ich weiß nicht, wie ich es machen soll

0
den_gera 19 Feb. 2020 im 18:35

3 Antworten

Beste Antwort

Bitte versuchen Sie den folgenden Code, um das ElementRef für jqxBulletChart zu erhalten

@ViewChildren(jqxBulletChartComponent,{read: ElementRef}) hellos: QueryList<ElementRef>;

Bitte beachten Sie, dass Sie die JQXBulletChartComponent angeben und die viewChildren als ElementRef lesen müssen.

Lassen Sie mich wissen, ob es für Sie funktioniert.

Viel Spaß beim Codieren !!!

1
Rahul Tokase 19 Feb. 2020 im 17:23

Ich denke, dass es keine Instanz von ElementRef sein kann, weil Sie ein ngFor verwenden. Es gibt mehrere Referenzen von dem, was Sie #charts nennen. Es sollte stattdessen QueryList sein

https://netbasal.com/understanding-viewchildren-contentchildren-and-querylist-in-angular-896b0c689f6e

1
ANMa 19 Feb. 2020 im 16:34

Versuche dies :

import {AfterViewInit, Component, QueryList, ViewChildren, ElementRef} from '@angular/core';

@Component({
  selector: "my-app",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.scss"]
})

export class AppComponent {
  name = "Angular";
  @ViewChildren("charts") charts: QueryList<ElementRef>;

  ngAfterViewInit() {
    this.charts.forEach(c => console.log(c));
  }
}
1
Oussail 19 Feb. 2020 im 16:57