Привет, у меня есть указание, как показано ниже,
@Directive({
selector: '[changeColor]',
exportAs:'changeColor'
})
export class ColorDirective {
@Input('mfData') public inputData: any[] = [];
constructor(elem: ElementRef, renderer: Renderer2) {
renderer.setStyle(elem.nativeElement, 'color', 'red');
console.info(this.inputData, 'inputData');
}
}
И используйте его, как показано ниже:
<h1 #x=changeColor>Hello</h1>
Что делать, если мое значение x
генерируется динамически (внутри ngFor). Как можно добавить индекс перед или после x, чтобы мое значение x было уникальным? как показано ниже
<h1 #x1=changeColor>Hello1</h1>
<h1 #x2=changeColor>Hello2</h1>
....
<h1 #xn=changeColor>Hellon</h1>
Пожалуйста, помогите мне в этом, ребята .. TIA
Обновленный HTML с переменной @Input
<div class = "col-12 u-grey-container table--section u-margin-bottom-8" *ngFor = "let color of colorList;let ndx = index">
<table class = "table table-striped" [mfData] = "color.list" #main = "changeColor" *ngIf = "color.list" (mfSelectedEntities) = "selectedRecords($event, schedule)">
<thead> ... </thead>
<tbody>
<template let-item ngFor [ngForOf] = "main.data" let-ndx = "index">
...
</tbdoy>
</table>
</div>
@yurzui Он уже внутри * ngFor ..
Тогда это должно сработать
когда я консоль в своей директиве, если есть несколько директив, он всегда получает первую ссылку
Допустим, у меня есть @ Input, `@Input ('mfData') public inputData: any [] = []; каждый раз, когда я консолью внутри своего компонента, это данные первой ссылки. Вот в чем проблема
Где у вас этот ввод? Я не вижу здесь проблемы, потому что вы можете ссылаться на любую директиву в массиве через индекс
Отредактировал мой вопрос с помощью ввода
Можете ли вы также добавить шаблон и где его консоль?
Обновил свой вопрос.
Просто используйте
#x = "changeColor"
внутри цикла*ngFor