Question

我目前正在使用AngularJS，这是我的HTML：

<tbody>
    <tr dir-paginate="tdata in tableData | orderBy:predicate:reverse | filter:searchFilter | itemsPerPage:10 track by $index ">
        <td class="table-data-edit-all">
            <input type="checkbox" ng-model="tdata.selectedCell">
        </td>
        <td class="align-left">
            {{ tdata.companyName }}
        </td>
        <td class="align-left">
            {{ tdata.department }}
        </td>
        <td>
            <a ng-click="editCompany({{ tdata.id }})"><i class="fa fa-edit"></i></a>
            <a ng-click="removeCompany({{ tdata.id }})"><i class="fa fa-remove"></i></a>
        </td>
    </tr>
</tbody>

这是Angular：

$scope.editCompany = function(index) {
    console.log(index);
    // my stuffs
}

加载页面时：

第一次，tdata.id在HTML视图中显示数字标识1 editCompany(index)也会打印到控制台号码1。
第二次，在我使用Angular orderBy sort后， tdata.id显示与之对应的号码10 tdata.companyName。但是，此时editCompany(index)仍然存在打印到控制台号码1，而不是10。

我该如何解决？

Answer 1

使用ng-click="editCompany(tdata.id)代替ng-click="editCompany({{tdata.id}})

<tbody>
    <tr dir-paginate="tdata in tableData | orderBy:predicate:reverse | filter:searchFilter | itemsPerPage:10 track by $index ">
        <td class="table-data-edit-all">
            <input type="checkbox" ng-model="tdata.selectedCell">
        </td>
        <td class="align-left">
            {{ tdata.companyName }}
        </td>
        <td class="align-left">
            {{ tdata.department }}
        </td>
        <td>
            <a ng-click="editCompany(tdata.id)"><i class="fa fa-edit"></i></a>
            <a ng-click="removeCompany(tdata.id)"><i class="fa fa-remove"></i></a>
        </td>
    </tr>
</tbody>

Answer 2

哟必须从代码中删除{{}}

在HTML中

<tbody>
<tr dir-paginate="tdata in tableData | orderBy:predicate:reverse | filter:searchFilter | itemsPerPage:10 track by $index ">
    <td class="table-data-edit-all">
        <input type="checkbox" ng-model="tdata.selectedCell">
    </td>
    <td class="align-left">
        {{ tdata.companyName }}
    </td>
    <td class="align-left">
        {{ tdata.department }}
    </td>
    <td>
        <a ng-click="editCompany(tdata.id)"><i class="fa fa-edit"></i></a>
        <a ng-click="removeCompany(tdata.id)"><i class="fa fa-remove"></i></a>
    </td>
</tr>

我希望这能帮到你

如何在HTML代码中获取动态变量的值

2 个答案: