使用ng-repeat在md-icon md-svg-src上进行角度ng-mouseover不起作用

时间:2016-11-30 10:35:47

标签: angularjs svg ng-repeat

我对这部分代码有误:



$scope.btns = {
            'telechargement': "assets/img/btns/Btn_telechargement.svg",
            'telechargement_hover': "assets/img/btns/Btn_telechargement-hover.svg"
        };

        $scope.setSessionDownloadHover = function(index){
            $scope.sessions_online[index].btn_download = $scope.btns.telechargement_hover;
        };

        $scope.setSessionDownloadLeave = function(index){
          $scope.sessions_online[index].btn_download = $scope.btns.telechargement;
        };

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<md-table-container ng-show="sessions_online.length > 0">
                    <table md-table md-progress="promise">
                        <thead md-head>
                        <tr md-row>
                            <th md-column >Nom de la séance</th>
                            <th md-column >Nom de la session</th>
                            <th md-column >Date de la session</th>
                            <th md-column ></th>
                        </tr>
                        </thead>
                        <tbody md-body>
                        <tr md-row ng-repeat="session in sessions_online">
                            <td md-cell>{{ session.seance_name }}</td>
                            <td md-cell>{{ session.name }}</td>
                            <td md-cell class="bold">{{ session.date | date: 'dd/MM/yyyy' }}</td>
                            <td md-cell>
                                <md-icon class="cursor-pointer"
                                         tabindex="{{$index}}"
                                         ng-click="downloadSessionFromId(session.id)"
                                         md-svg-src="{{session.btn_download}}"
                                         ng-init="session.btn_download = btns.telechargement;"
                                         ng-mouseover="setSessionDownloadHover($index)"
                                         ng-mouseleave="setSessionDownloadLeave($index)"
                                         style="width: 38px; height: 38px;">
                                    <md-tooltip md-direction="left">
                                        {{$index}} -
                                        Télécharger le contenu de la session sur cet ordinateur
                                    </md-tooltip>
                                </md-icon>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </md-table-container>
&#13;
&#13;
&#13;

每个md-icon都会在鼠标悬停时更改它的svg。 但问题是,当我将鼠标放在一个md-icon上时,svg src会发生变化,但不会应用。 当我将鼠标放在最后一个md-icon上时,它的svg src会发生变化,视图中的所有svg都会被更改,但代码中没有。

你有解释吗?

感谢。

1 个答案:

答案 0 :(得分:1)

我已经解决了我的问题

&#13;
&#13;
 $('#user-detail-datatable tbody tr td a').on('click', function () {

        //prepoluting values on edit
        $("#CarryUser").val($(this).closest('tr').find('td')[5].outerText);
        d = $(this).closest('tr').find('a')[1].id;
        $("#display").val($(this).closest('tr').find('td')[6].outerText);
        UsingBranchId = $(this).closest('tr').find('td')[2].outerText;
        $("#fileUpload").val($(this).closest('tr').find('td')[0].outerText);
    });
&#13;
&#13;
&#13;

我认为导致问题的是md-icon或md-icon:md-svg-src的属性。