Как уменьшить строку для viewchild в angular 8? - PullRequest
0 голосов
/ 31 января 2020

У меня много строк в моем проекте. Как уменьшить линию. Есть ли способ?

Пожалуйста, помогите найти решение.

app.component.ts:

@ViewChild('pRef') pRef: ElementRef;
@ViewChild('Ref') Ref: ElementRef;
@ViewChild('pR') pR: ElementRef;
@ViewChild('ef') ef: ElementRef;
@ViewChild('main') main: ElementRef;
@ViewChild('power') power: ElementRef;
@ViewChild('current') current: ElementRef;
@ViewChild('volt') volt: ElementRef;
@ViewChild('rm') rm: ElementRef;
@ViewChild('wire') wire: ElementRef;
@ViewChild('cable') cable: ElementRef;
@ViewChild('on') on: ElementRef;
@ViewChild('off') off: ElementRef;
@ViewChild('amp') amp: ElementRef;
@ViewChild('short') short: ElementRef;
@ViewChild('cap') cap: ElementRef;

Ответы [ 2 ]

0 голосов
/ 31 января 2020

Согласно вашему стеку, чтобы изменить все элементы, вы можете создать директиву:

@Directive({
  selector: '[myDiv]'
})
export class TextTransform implements AfterViewInit {

    constructor(private elem: ElementRef) {}

     ngAfterViewInit() {
        this.elem.nativeElement.innerHTML = ' !!My new Text!!';
     }
}

и применить директиву к элементу:

<p myDiv> Start</p>

Здесь пример

0 голосов
/ 31 января 2020

Я думаю, это хороший вздох, который показывает, что ваш app.component.ts знает и делает слишком много. Вероятно, было бы здорово разделить ответственность и передать некоторые логики c другим дочерним компонентам. Или вы можете создать директиву (например, CollectorDirective), прикрепить ее ко всем элементам DOM, которые вы хотите получить (например: <someComponent your-directive-selector></someComponent>), и в вашем app.component.ts вы можете использовать что-то вроде этого: @ViewChild(CollectorDirective) allElements: QueryList<CollectorDirective>; и в this.allElements вы получите массив детей, к которым прикреплен CollectorDirective. Но без контекста не ясно, является ли это именно тем, что вам нужно, и будет ли это работать для определенного варианта использования.

...