升级 angularjs 1.2 到 1.3 指令 ng-repeat 范围问题

Question

目前正在尝试从 angularjs 1.2 更新到 1.3，但发现了一个问题。该应用程序有一个分页指令：

app.directive("mobilePaginationList", function() {
 return {
        restrict: 'E',
        templateUrl: "Directives/mobilePagination/List/mobilePaginationList.html",
        transclude: true,
        replace: true,
        scope: {
            list: '=list'
        },
        link: function ($scope, $element, $attributes) {
            // code removed that is not relevant
            $scope.listToDisplay = PaginationService.from(origList).getPage(page);
        }
    }

}

模板是：

<div class="row">
    <div class="col-xs-12">
        <div data-ng-repeat="currentItem in listToDisplay"  bindonce data-ng-transclude>
        </div>
        <mobile-pagination-pager data-ng-hide="vm.list.length <= 0"></mobile-pagination-pager>
    </div>
</div>

用法示例：

<mobile-pagination-list data-receipt-slider-menu-toggle="active" list="receipts" data-ng-hide="list.length <= 0 || rootVm.loading.receipts.value" class="row list-group">
        <a class="row list-group-item" data-bo-id="currentItem.attachNo" ui-sref="receiptWalletDetails({receiptId: currentItem.attachNo})">
            <div class="col-xs-11">
                <div class="row">
                    <div class="col-xs-8">
                        <h4 data-bo-bind="currentItem.description"></h4>
                    </div>
                    <div class="col-xs-4 text-right">
                        <h4 data-bo-bind="currentItem.amount | currency:''"></h4>
                    </div>
                </div>
                <div class="list-group-item-text">
                    <div class="row">
                        <div class="col-xs-8">
                            <span data-bo-bind="currentItem.notes"></span>
                        </div>
                        <div class="col-xs-4 text-right">
                            <span class="text-info"
                                data-bo-bind="currentItem.createDate | date: 'd MMM yyyy'">
                            </span>
                        </div>
                    </div>
                </div>
            </div>
        </a>
    </mobile-pagination-list>

发生的事情是 ng-repeat 正确显示行数，但每行不包含来自 currentItem 对象的任何数据。该行包含所有 HTML 但缺少 currentItem 值。

我已经对这个问题做了很多搜索，但还没有找到解决方案。

干杯

Answer 1

您可能希望在 currentItem 之前包含 $parent。类似下面

用法：

<mobile-pagination-list data-receipt-slider-menu-toggle="active" list="receipts" data-ng-hide="list.length <= 0 || rootVm.loading.receipts.value" class="row list-group">

    <a class="row list-group-item" data-bo-id="$parent.currentItem.attachNo" ui-sref="receiptWalletDetails({receiptId: currentItem.attachNo})">
        <div class="col-xs-11">

          <h4 ng-bind="$parent.currentItem.description"></h4>
          <h4 ng-bind="$parent.currentItem.amount | currency:''"></h4>
          <span ng-bind="$parent.currentItem.notes"></span>
          <span class="text-info" ng-bind="$parent.currentItem.createDate | date: 'd MMM yyyy'">
          </span>

        </div>
    </a>
</mobile-pagination-list>

这是一个带有工作示例的 plunker。

请注意，您的代码已修改以去除依赖项。

升级 angularjs 1.2 到 1.3 指令 ng-repeat 范围问题

upgrade angularjs 1.2 to 1.3 directive ng-repeat scope issue

angularjs

directive