Структурная директива pass Html Значение атрибута Elements - PullRequest
0 голосов
/ 16 марта 2020

Я использую Angular CLI 6.1.4, и в настоящее время я борюсь со следующей проблемой:

Я создал структурную директиву, которая должна работать аналогично *ngIf, но с именем html -элемента или значения атрибута id, чтобы решить, показывать его или нет.

Проблема в том, что я просто не могу получить атрибут имени моего <button>, переданный моей структурной директиве.

My Кнопка:

<button name="bla" *ngIfVisible="this.name">TEST</button> //this is not working!

Моя структурная директива

import { Directive, TemplateRef, ViewContainerRef, Input } from '@angular/core';
import { UserPermissionService } from '../services/user-permission.service';

@Directive({
  selector: '[ngIfVisible]'
})
export class NgIfVisible {

  constructor(private templateRef: TemplateRef<any>, private viewContainer: ViewContainerRef, private userPermissionService: UserPermissionService) { }

  @Input()
  set ngIfVisible(name: any) {
      if (this.userPermissionService.isElementVisible(name)) {
        this.viewContainer.createEmbeddedView(this.templateRef);
      } else {
        this.viewContainer.clear();
      }
  }
}

Я просто хочу, чтобы имя bla было передано директиве ...

Я уже пробовал:

<button #name="bla" *ngIfVisible="name">TEST</button>

и

<button name="bla" *ngIfVisible="$(this).attr('name')">TEST</button>

Но ни один из них не работает ... Пожалуйста, помогите!

1 Ответ

0 голосов
/ 16 марта 2020

Попробуйте:

<button *ngIfVisible="name;name:'bla'">TEST</button>

И в вашей директиве прочитайте дополнительное свойство name как ngIfVisibleName (обратите внимание, что здесь Name, а не name) как Input точно так же, как вы делаете с ngIfVisible.

Как использовать Angular структурную директиву с несколькими входами

...