javascript - 将参数传递到$ ionicModal

将参数传递到$ionicModal以便将值用于模态（即receipt.html）的最佳方法是什么。

Confirm.html

<a
  class="button button-stable"
   style="border-radius:0px"
   ng-click="openReceiptModal(selectedBusinessNoCategory.id, selectedDummyService.id)">
   View Receipt
</a>

controller.js

  $ionicModal.fromTemplateUrl('templates/receipt.html', {
    scope: $scope,
    animation: 'slide-in-up'
  }).then(function(modal) {
    $scope.receiptModal = modal;
  })

  $scope.openReceiptModal = function() {
    $scope.receiptModal.show()
  }

  $scope.closeReceiptModal = function() {
    $scope.receiptModal.hide();
  };

  $scope.$on('$destroy', function() {
    $scope.receiptModal.remove();
  });

receive.html

<ion-content>
    <div class="list">
        <div class="item item-input-inset">
            <div class="row">
                <div class="col"><p style="small">To</p></div>
                <div class="col col-50"><p style="small">{name}</div>
            </div>
        </div>
        <div class="item item-input-inset">
            <div class="row">
                <div class="col"><p style="small">For</p></div>
                <div class="col col-50"><p style="small">{{selectedBusiness.title}}</div>
            </div>
        </div>
        <div class="item item-input-inset">
            <div class="row">
                <div class="col"><p style="small">Appointment Date</p></div>
                <div class="col col-50"><p style="small">{{selectedBusiness.date}}</div>
            </div>
        </div>
        <div class="item item-input-inset">
            <div class="row">
                <div class="col"><p style="small">Confirmation</p></div>
                <div class="col col-50"><p style="small">{{selectedBusiness.confirmation}}</div>
            </div>
        </div>
        <div class="item item-input-inset">
            <div class="row">
                <div class="col"><p style="small">Method</p></div>
                <div class="col col-50"><p style="small">{{selectedBusiness.method}}</div>
            </div>
        </div>
        <div class="item item-input-inset">
            <div class="row">
                <div class="col"><p style="small">Amount</p></div>
                <div class="col col-50"><p style="small">&pound;{{selectedService.price}}</div>
            </div>
        </div>
        <div class="item item-input-inset">
            <div class="row">
                <div class="col"><p style="small">Cancellation Fee</p></div>
                <div class="col col-50"><p style="small">&pound;{{selectedService.price}}</div>
            </div>
        </div>
    </div>
</ion-content>

最佳答案

正如您在scope: $scope定义中指定的$ionicModal.fromTemplateUrl()一样，模态继承了父作用域。

因此，您可以将$scope.openReceiptModal()的参数传递给控制器​​$ scope：

  $scope.openReceiptModal = function(_selectedBusinessNoCategory, _selectedDummyService) {
    $scope.selectedBusinessNoCategory = _selectedBusinessNoCategory;
    $scope.selectedDummyService = _selectedDummyService;
    $scope.receiptModal.show()
  }

此时，selectedBusinessNoCategory和selectedDummyService被模式范围继承（连同父控制器范围），您可以在模式模板中使用它们。

这是一个示例：http://codepen.io/beaver71/pen/ZQwwgb

关于javascript - 将参数传递到$ ionicModal，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35387149/