Модель связывания динамически в angular2

Question

Модель связывания динамически в angular2

1

Я хочу связать модально динамически в Angular2. Вот мой код

<div *ngFor="let interest of interest_data;" class="row">
    <a class="btn btn-xs btn-link" data-toggle="modal" data-target="#{{interest.id}}">
       <i class="fa fa-pencil"></i>
    </a>
</div>

и целевой модальный элемент равен ниже

<div *ngFor="let interest of interest_data;">
    <div class="modal fade" id="interest.id"  tabindex="-1" role="dialog"
    aria-labelledby="modalLabel" aria-hidden="true">
    </div>
</div>

Это не работает. Каков правильный способ сделать это?

bhatia 04 июнь 2017, в 08:14

Источник

Теги:

angular

javascript

1 ответ

Ещё вопросы

Spitfire · Accepted Answer · 2017-06-04T03-36-00.000Z

Попробуйте использовать [attr.data-target] и [attr.id]. Я думаю, вы хотите сделать что-то вроде этого:

<div *ngFor="let interest of interest_data;">

  <div>
    <a class="btn btn-xs btn-link" data-toggle="modal" [attr.data-target]="'#' + interest.id">
      open modal
      <i class="fa fa-pencil"></i>
    </a>
  </div>

  <div class="modal fade" [attr.id]="interest.id" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        modal data
      </div>
    </div>
  </div>

</div>

Обязательно включите JQuery и bootstrap.js.

ура

Теперь работает нормально. Большое спасибо !!