Question

所以我有这些框显示使用ng-repeat创建的数组的最小信息。可能有1和10个项目返回对象及其属性这些框是可单击的，单击时，应填充表格。问题是，我一直得到一个参考错误，对于我这样的人，看不出原因。该函数已定义，应根据框的Id调用并填充表，以填充表中的更多信息。数组对象称为“滑动”。

我的html包装盒：

<div  class="swipeBoxes" ng-repeat="swipe in swipes">
    <a href="" ng-click="editSwipe(swipe.id)" >
        <div class="swipeBox col-md-12">
            <div class="col-md-12 claimObject">
                <span class="claimLine" style="width: 3px; position: absolute; top: 5px; left: 5px;">{{ $index + 1 }}.</span>
                <span class="claimedLeft">swipe date:</span>
                <span class="claimedRight">{{ swipe.date | date: 'MM/dd/yyyy'}}</span>
            </div>
            <div class="col-md-12 claimObject">
                <span class="claimedLeft">provider:</span
                ><span class="claimedRight">{{ swipe.merchant }}</span>
            </div>
            <div class="col-md-12 claimObject">
                <span class="claimedLeft">amount:</span>
                <span class="claimedRight">{{ swipe.amount | currency }}</span>
            </div>
        </div>
    </a>
</div>

我的目标表，一旦从上面选择了一个对象，就应填充数据：

<div class="swipeDetails col-md-12">
    <div class="swipeFlexHead col-md-12">
        <p>Swipe Details</p>
    </div>
    <div class="swipeFlexHead2 col-md-12">
        <p>{{ swipe.merchant }}</p>
    </div>
    <div class="col-md-12">
        <div class="swipeFlexElement col-md-4">
            <p>Swipe Date</p>
            <p>{{ swipe.date | date: 'MM/dd/yyyy' }}</p>
        </div>
        <div class="swipeFlexElement col-md-4">
            <p>Status</p>
            <p>{{ swipe.status }}</p>
        </div>
        <div class="swipeFlexElement col-md-4">
            <p>Card Used</p>
            <p>{{ swipe.cardHolder }} {{ swipe.cardUsed }}</p>
        </div>
    </div>    
    <div class="col-md-12">                                            
        <div class="swipeFlexElement col-md-4">
            <p>Swipe Amount</p>
            <p>{{ swipe.amount | currency }}</p>
        </div>
        <div class="swipeFlexElement col-md-4">
            <p>Amount Requiring Documentation</p>
            <p>{{ swipe.reqAmount | currency }}</p>
        </div>
        <div class="swipeFlexElement col-md-4">
            <p>Documentation Due Date</p>
            <p>{{ swipe.dueDate | date: 'MM/dd/yyyy' }}</p>
        </div>                                                                                                                        
    </div>
</div>

最后，我的控制器正在提取数据并具有'editSwipe'功能：

app.controller('swipeController', ['$scope', 'swipesService', '$location', 'Upload', '$timeout', '$filter', 'utilsService',
  function ($scope, swipesService, $location, Upload, $timeout, $filter, utilsService) {

    $scope.swipes = [];
    $scope.swipeFormSubmitted = false;

    swipesService.getSwipes().then(function (results) {

        $scope.swipes = results.data;

    }); 

    $scope.swipe = {
        id: '',
        descr: '',
        merchant: '',
        date: '',
        amount: '',
        reqAmount: '',
        status: '',
        cardUsed: '',
        cardHolder: '',
        dueDate: ''
    }

    $scope.editSwipe = function(id) {
        $scope.swipeInfo = angular.copy(swipe);
    };

}]);

Answer 1

在editSwipe功能中，您没有对id做任何事情。使用angular.copy(swipe)您正在使用未定义的滑动。我想你要复制你点击的滑动，然后你需要做

ng-click="editSwipe(swipe)"

$scope.editSwipe = function(swipe) {
    $scope.swipe = angular.copy(swipe); // I don't see where you use swipeInfo?
};

顺便说一句：是否需要深度复制滑动？您是否只能传递参考$scope.swipe = swipe;

角度ng-click函数是否填充了表格？

1 个答案: