角度 attr.data-target 和 attr.id 不起作用

Question

我正在尝试为我的引导模式分配唯一 ID，因为它正在使用 ngFor。以下是我的代码。

<div class="container shadow lead-container" data-toggle="modal" [attr.data-target]="customId"> -------------------------> . Data-target is set to customId

  <div class="row text-left">

    ----------------------> Other Content goes here

  </div>

</div>

<!--Lead Popup-->

<div class="modal fade" [attr.id]="customId" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true"> -----------> [attr.id] is set to customid

    <div class="modal-dialog" role="document">

      <div class="modal-content">

        <div class="container popup-container">

          <div class="row text-left">

             -------------------------------------> Modal Content Goes Here 

        </div>

      </div>

    </div>

  </div>

以下是我的component.ts：

import { Lead } from './../models/lead';

import { Component, OnInit, Input } from '@angular/core';

@Component({

  selector: 'app-lead',

  templateUrl: './lead.component.html',

  styleUrls: ['./lead.component.css']

})

export class LeadComponent implements OnInit {

  @Input() public lead: Lead;

  @Input() public index;

  public customId: string;

  constructor() { 

  }

  ngOnInit() {

    this.customId = "custom".concat(this.index);

  }

}

当我点击 div 时。由于某种原因，模态不会弹出。任何帮助将非常感激

Answer 1

将“#”添加到 ID。[attr.data-target]="'#'+customId"