javascript - Angular-UI Bootstrap : pass value from Trigger's button to Modal's button

标签 javascript angularjs twitter-bootstrap

需要一些指导。我正在将 angular-ui-bootstrap 与 php 和 mysql 一起使用。我想在每次模态加载时将链接列表(从 php mysql 生成)中的值传递给模态按钮。

HTML

// Below link is while-loop with php-mysql result
<a href="#" data-refno="<?php echo $r->wo_ref_no; ?>" ng-click="open()">Issue</a> 

<script type="text/ng-template" id="SubmissionReminder.html">
  <div class="modal-header">
    <h3 class="modal-title">Submission Work Order Request</h3>
  </div>
  <div class="modal-body">
    Please ensure quotation(s) or any document(s) related to this Work Order is ready for Procurement Unit to proceed accordingly.
  </div>
  <div class="modal-footer">
    <button class="btn btn-default" type="button" ng-click="cancel()">Cancel</button>
    <a href="issue.php?wo_ref={{ refno }}" class="btn btn-primary">Submit</a>
  </div>
</script>

JS

app.controller('userWOController', function ($scope, $modal) {

  $scope.animationsEnabled = true;

  $scope.open = function () {
    $scope.items = [];
    var modalInstance = $modal.open({
      animation: $scope.animationsEnabled,
      templateUrl : 'SubmissionReminder.html',
      controller: 'SubmissionReminder'
    });
  };

  $scope.toggleAnimation = function () {
    $scope.animationsEnabled = !$scope.animationsEnabled;
  };

});


app.controller('SubmissionReminder', function ($scope, $modalInstance) {

  $scope.cancel = function () {
    $modalInstance.dismiss('cancel');
  };
});

我陷入了如何将值从触发器(a href)传递到模式按钮(a href)的困境。

最佳答案

您可以通过resolve对象将数据发送到模态 Controller :

var modalInstance = $modal.open({
  animation: $scope.animationsEnabled,
  templateUrl : 'SubmissionReminder.html',
  controller: 'SubmissionReminder',
  resolve: {
    refno: function () {
      return {refno: $scope.refno};
    }
  }
});

然后从模态 Controller 中获取解析的refno:

app.controller('SubmissionReminder', function ($scope, $modalInstance, refno) {
  $scope.refno = refno().refno;
  ...
}

关于javascript - Angular-UI Bootstrap : pass value from Trigger's button to Modal's button,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32646470/

相关文章:

javascript - AWS Lambda 中的 HTTP GET 只能运行一次

javascript - 如何在 javascript 中更改 "html"本身的 CSS 属性?

javascript - AngularJS ng-click stopPropagation

html - 如何制作响应式导航栏?

javascript - 如何使用 bokeh 和 javascript 旋转 2D 笛卡尔图?

javascript - JavaScript 和 jQuery 中的单击源,人工还是自动?

javascript - 组件无法解析 $scope 的注入(inject)( Angular 1.3.16)

javascript - 解析 ng-show 时出现 Angular 错误

javascript - 多个自定义 HTML5 视频控件中的索引图标

html - 图像叠加文本不响应 Bootstrap