CODEWITHSUNDEEP
htmlangulartypescriptangular-structural-directive
Dacili
Dacili

Reputation: 388

Is there a way to use a custom structural directive in some condition in Angular?

I have this custom structural directive, <div *someDirective> which shows div, if some condition is satisfied.

Now, I need to do conditional styling:
<div [ngClass]="SelectedProductId !== 0 && *someDirective ? 'w-23' : 'w-30'"

but this obviously throws errors.

It seems like impossible. So my question is, is this possible somehow to achieve at all?

Upvotes: 0

Views: 165

Answers (2)

Dacili
Dacili

Reputation: 388

It's not possible.
Workaround would be:
In service create that function. Use it in conditions or .ts files. And if you want to have that logic in a custom pipe, inject that service in it, and use it there.

@Pipe({
  name: 'getLabelNameById',
})
export class GetLabelNameByIdPipe implements PipeTransform {
  constructor(private someService: SomeService) {}
  transform(id: number): string {
    return this.someService.findLabelById(id);
  }
}

Upvotes: 0

Francesco Moro
Francesco Moro

Reputation: 380

I think it's not possible. The first approach coming into my mind is to keep the business logic into an injectable service. Then, the existing directive will inject and use it. For the conditional class I would create a pipe instead which - as the directive - uses the created service.

Upvotes: 1

Related Questions