jQuery css3对angular4的影响

Question

http://www.bestjquery.com/?SGavh3Aj 基于jquery的示例

我使用相同的html文件，显示表的第一部分包含Accounts详细信息和底部内容，以进行删除，修改和获取操作。 要进行操作，其他部门似乎会显示阿拉操作。

<div  *ngIf="comptesCourantsPart?.totalElements>0">

                      <table  id="content" #content class="table table-striped projects">

                        <thead>
                        <tr>
                          <th>ID</th>
                          <th>Solde<small>(dinars)</small><span [ngClass]="{'tricpt':tricpt==2}" class="glyphicon glyphicon-sort-by-attributes-alt pull-right" (click)="triParSolde()" tooltip="solde decroissant"></span></th>
                          <th>Decouvert<small>(dinars)</small><span [ngClass]="{'tricpt':tricpt==1}" class="glyphicon glyphicon-sort-by-attributes-alt pull-right" (click)="triParDecouvert()" tooltip="decouvert decroissant"></span></th>
                          <th>Date de Création</th>
                          <th>Numero compte</th>
                          <th>Propriétaire</th>
                          <th>Action<span style="cursor: pointer;" class="glyphicon glyphicon-link pull-right" *ngIf="tricpt!=0" (click)="enleverTri()" data-placement="right" tooltip="désactiver tri"></span></th>
                        </tr>
                        </thead>

                        <tbody>
                    <tr  *ngFor="let compte of comptesCourantsPart?.content">
                      <td>{{compte.idcpt}}</td>
                      <td>{{compte.solde}}</td>
                      <td>{{compte.decouvert}}  </td>
                      <td>{{compte.datedecreation}}</td>
                      <td>{{compte.numeroCompte}}</td>

                      <td>{{client.nom}}&nbsp;{{client.prenom}}</td>

                      <td>
                        <div>
                          <a (click)="afficherDetail(compte,tempDetailCompteCourant)" tooltip="détail compte" style="height: 20px;" class="btn btn-success btn-xs"><i class="fa fa-pencil"></i> view </a>
                          <a (click)="ouvrirModalModifCompteCourant(compte,tempModificationCompteCourant)" style="height: 20px;" tooltip="Modifier compte" class="btn btn-info btn-xs"><i class="fa fa-balance-scale"></i> Edit </a>

                          <a (click)="ouvrModalSuppression(tempSuppressionCompte,compte)" style="height: 20px;" tooltip="supprimer compte" class="btn btn-danger btn-xs"><i class="fa fa-trash-o"></i> Delete </a>
                          <a (click)="getOperations(compte)" style="height: 20px;" tooltip="chercher opérations" class="btn btn-warning btn-xs pull-right"><i class="fa fa-cogs"></i> opérations </a>


                        </div>
                      </td>

                    </tr>
                    </tbody>


                      </table>

//和第二部分以显示操作

 <div  *ngIf="retraits?.totalElements>0">
                          <table  id="dtgre"  class="table table-hover">
                            <thead>
                            <tr>
                              <th>ID</th>
                              <th>Date operation</th>
                              <th>Montant crédit/debit</th>
                              <th>Type operation</th>
                              <th>Libelle Mouvement</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr *ngFor="let operation of retraits?.content">
                              <td>{{operation.numero}}</td>
                              <td class="w3-text-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>{{operation.deateoperation}}</td>
                              <td >{{operation.montant}}&nbsp;<i>(dt)</i></td>
                              <td>{{operation.op}}</td>
                              <td  class="clickmoi" >{{operation.libelle}}
                                <span  data-placement="right" (click)="affichageLibelleMvt(operation)" [ngClass]="{'cl':opt==operation}" class="pull-right glyphicon glyphicon-info-sign"></span>
                              </td>
                            </tr>

                            </tbody>

                          </table>
                          <div  style="padding-left: 200px">

                          </div>
                        </div>