javascript - 将参数传递给 AngularJS 模板内的函数

Question

我想知道如何在 AngularJS 模板中动态传递参数。 我的表中有很多行，每行都有一个按钮添加存款。我想将行号传递给该按钮的 ng-click 函数。

这是我的模板的片段:

<div id="documentsTable" class="table-responsive">
<table class="table">
    <thead>
        ...
    </thead>
    <tbody ng-repeat="document in data">
        <tr>
            ...
            <td>
                ...
                <button ng-show="document.depositCheckbox" ng-click="addDeposit({id: document.number})" id="addDepositBtn"
                        type="submit" class="btn btn-primary">Add deposit</button>
            </td>
        </tr>
    </tbody>
</table>

指令:

.directive('documentDirective', ['$compile', '$templateCache', function () {
return {
    templateUrl: 'templates/documentTemplate.html',
    scope: {
        data: '=',
        addDeposit: '&'
    },
    restrict: 'E'
}}]);

在我的 HTML 文件中，我有:

<document-directive data="documents" add-deposit="addDeposit()"></document-directive>

我的 Controller 中的函数 addDeposit:

$scope.addDeposit = function(documentId) {
    for(var i=0; i<$scope.documents.length; i++) {
        if($scope.documents[i].number == documentId) {
            var depositLength = $scope.documents[i].deposit.length;
            var deposit = {'number': depositLength, 'value': 0, 'paymentDate': new Date(), 'firstRow': false};
            $scope.documents[i].deposit.push(deposit);
            break;
        }
    }
}

谢谢!

Answer 1

好的，据我了解，您正在尝试获取从哪一行获取发布请求？

我认为您应该能够使用 ng-changed 的​​ $index 属性来做到这一点。

所以类似:

<button ng-show="document.depositCheckbox" ng-click="addDeposit({id: document.number, rowNumber: $index})" id="addDepositBtn"
                        type="submit" class="btn btn-primary">Add deposit</button>

编辑: 那么试试这个:

<button ng-show="document.depositCheckbox" ng-click="addDeposit()(document.number)" id="addDepositBtn" type="submit" class="btn btn-primary"> Add deposit</button>

以及将函数传递到的位置:

<document-directive data="documents" add-deposit="addDeposit"></document-directive>

传入方法作为参数: https://stackoverflow.com/a/26244600/1958344