Визуализация элемента на основе его присутствия в указанном c компоненте - PullRequest
Новая
       4

Визуализация элемента на основе его присутствия в указанном c компоненте

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

У меня есть этот компонент многократного использования: 

      <h4>Our viewers reviews</h4>

      <ul class="list-group" style="color:black" >
        <div *ngIf="userReviews">
        <li class="list-group-item" *ngFor="let r of userReviews;let i=index">
         <p  class="font-weight-bold text-left">{{r.movie}}</p>
          <div class="img-wrapper">
          <img class="img-fluid" src="{{ r.poster }}" alt="{{ r.poster }}" />
        </div>
          <br>
          <p  class="font-weight-bold text-left"> {{r.review}}</p>
          <br>
          <span  class=" font-weight-bold text-left">by </span><span  class="font-italic">{{r.author}} </span>

          <button  style="float:right" (click)="delete()"  class="btn btn-danger">Delete</button>
        </li>
      </ul>
    </div>

Я рендеринг этого HTML в домашнем компоненте и в компоненте администратора, но я хочу только показать эту кнопку удаления 

<button style="float:right" (click)="delete()" class="btn btn-danger">Delete</button>

на странице администратора. На домашней странице удаление должно быть невидимым. Я думаю, что в некоторых решениях, но ни одно из них не кажется хорошим, и оно будет повторять код

Может кто-нибудь предложить решение?

1 Ответ

1 голос
/ 04 марта 2020

Попробуйте:

В повторно используемом компоненте выполните: 

@Input() showDeleteButton: boolean;
....
//HTML
 <button *ngIf="showDeleteButton"  style="float:right" (click)="delete()"  class="btn btn-danger">Delete</button>

И в компоненте home отправьте false для showDeleteButton и в компоненте admin , отправь истину за showDeleteButton.

...