Angular在属性html中不起作用

Question

  

大家好，我想设置data-toggle =变量{{hero.ID}}，但它不起作用

我的代码为Angular

<tr *ngFor="let hero of result" id="{{hero.iID}}">
        <td class="form-check">
          <label class="form-check-label">
            <input class="form-check-input" (click)="checkedItem('check'+hero.iID)" id="check{{hero.iID}}" name="checkItem"
              type="checkbox" value="">
            <span class="form-check-sign">
              <span class="check"></span>
            </span>
          </label>
        </td>
        <td (click)="fDetail(hero.iID,hero.dBirthDay,hero.dCreateDate,hero.nAddress,hero.nEmail,hero.nFullName,hero.nGender,hero.nPassWord,hero.nPhone,hero.nUserName)"
          data-toggle="{{hero.iID}}" data-target="#exampleModal" [ngStyle]="{'color':hero.iActive?'#3c4858':'red'}">{{hero.nFullName}}</td>
        <td (click)="fDetail(hero.iID,hero.dBirthDay,hero.dCreateDate,hero.nAddress,hero.nEmail,hero.nFullName,hero.nGender,hero.nPassWord,hero.nPhone,hero.nUserName)"
          data-toggle="{{hero.iID}}" data-target="#exampleModal" [ngStyle]="{'color':hero.iActive?'#3c4858':'red'}">{{hero.nPhone}}</td>
        <td (click)="fDetail(hero.iID,hero.dBirthDay,hero.dCreateDate,hero.nAddress,hero.nEmail,hero.nFullName,hero.nGender,hero.nPassWord,hero.nPhone,hero.nUserName)"
          data-toggle="{{hero.iID}}" data-target="#exampleModal" [ngStyle]="{'color':hero.iActive?'#3c4858':'red'}">{{hero.nUserName}}</td>
        <td (click)="fDetail(hero.iID,hero.dBirthDay,hero.dCreateDate,hero.nAddress,hero.nEmail,hero.nFullName,hero.nGender,hero.nPassWord,hero.nPhone,hero.nUserName)"
          data-toggle="{{hero.iID}}" data-target="#exampleModal" [ngStyle]="{'color':hero.iActive?'#3c4858':'red'}">{{hero.nAddress}}</td>
        <td (click)="fDeletes(hero.iID,hero.iActive)" class="btn {{hero.iActive?'btn-danger':'btn-info'}}">{{hero.iActive?"Disabled":"Active"}}</td>
  </tr>

还有我的错误：

Can't bind to 'toggle' since it isn't a known property of 'td'. ("s,hero.nEmail,hero.nFullName,hero.nGender,hero.nPassWord,hero.nPhone,hero.nUserName)"
          [ERROR ->]data-toggle="{{hero.iID}}" data-target="#exampleModal" [ngStyle]="{'color':hero.iActive?'#3c4858':'re"): ng:///AppModule/CustomersComponent.html@221:14 

  

最后：   如何设置属性data-toggle = {{<< strong> hero.ID }}工作？还是一样？

Answer 1

尝试使用attr进行绑定

[attr.data-toggle]="hero.iID"

Answer 2

默认情况下，Angular使用属性绑定，但是data-toggle没有属性。要明确告诉Angular使用属性绑定，请改用：

[attr.data-toggle] = "hero.iID"