Я сделал весь элемент li интерактивным, используя тег привязки как таковой:

 <li *ngIf="notification.payload.table">
      <a class="d-flex justify-content-between" (click)="updateTableNotificationReadStatus(notification)">
        <div class="d-flex flex-column">
          <span style="font-size: 1.1rem">
            <strong>{{notification.payload.username}}</strong> requested access for table - {{notification.payload.table}}.
              <span style="font-size: 0.9rem">{{notification.payload.time}}</span>
          </span>
          <span *ngIf="notification.payload.note"class="note">
            <span class="noteLabel">Note</span>
            <span> This is a note attached to it</span>
          </span>
        </div>
        <span>
          <fa-icon [icon]="faClose" class="ml-auto" (click)="deleteNotification(notification)"></fa-icon>
        </span>
      </a>
    </li>

Когда я нажимаю на значок fa, уведомление удаляется, но меня также перенаправляют на другую страницу из-за функции, в которой я не хочу?

Как я могу сделать значок закрытия кликабельным без перенаправления, находясь на том же элементе?

0
s4tr2 25 Сен 2018 в 15:47

2 ответа

Лучший ответ

Я добился этого, используя:

 deleteNotification(e, notification) {
    e.stopPropagation();
  }
0
s4tr2 28 Сен 2018 в 10:31

Мне кажется, что вам нужно что-то похожее на этот вопрос AngularJS ng-click stopPropagation

Чтобы прекратить распространение события

$event.stopPropagation();
2
Grissom 25 Сен 2018 в 12:50