AngularJS + UI Bootstrap Modal example of modal using angularjs sending data to modal

<!doctype html>
<html ng-app="ui.bootstrap.demo">
<head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-animate.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-sanitize.js"></script>
    <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-2.5.0.js"></script>
    <script src="script.js"></script>
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>

    <div ng-controller="ModalDemoCtrl as pc" class="modal-demo">
        <button type="button" class="btn btn-default" ng-click="pc.open()">Open me!</button>
        <button type="button" class="btn btn-default" ng-click="pc.open('lg')">Large modal</button>
        <button type="button" class="btn btn-default" ng-click="pc.open('sm')">Small modal</button>
        <div>data in controller : <strong>{{ pc.data }}</strong></div>
    </div>
</body>

</html>

// Code goes here

angular.module('ui.bootstrap.demo', ['ngAnimate', 'ngSanitize', 'ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('ModalDemoCtrl', function ($uibModal, $log) {
  var pc = this;
  pc.data = "Lorem Name Test"; 

  pc.open = function (size) {
    var modalInstance = $uibModal.open({
      animation: true,
      ariaLabelledBy: 'modal-title',
      ariaDescribedBy: 'modal-body',
      templateUrl: 'myModalContent.html',
      controller: 'ModalInstanceCtrl',
      controllerAs: 'pc',
      size: size,
      resolve: {
        data: function () {
          return pc.data;
        }
      }
    });

    modalInstance.result.then(function () {
      alert("now I'll close the modal");
    });
  };
});

angular.module('ui.bootstrap.demo').controller('ModalInstanceCtrl', function ($uibModalInstance, data) {
  var pc = this;
  pc.data = data;
  
  pc.ok = function () {
    //{...}
    alert("You clicked the ok button."); 
    $uibModalInstance.close();
  };

  pc.cancel = function () {
    //{...}
    alert("You clicked the cancel button."); 
    $uibModalInstance.dismiss('cancel');
  };
});

AngularJS  + UI Bootstrap Sending data to modal
Follow me for more https://github.com/matheusmurta

<div class="modal-header">
    <h3 class="modal-title" id="modal-title">I'm a modal!</h3>
</div>
<div class="modal-body" id="modal-body">
    <ul>
        {{pc.data}}
    </ul>
</div>
<div class="modal-footer">
    <button class="btn btn-primary" type="button" ng-click="pc.ok()">OK</button>
    <button class="btn btn-warning" type="button" ng-click="pc.cancel()">Cancel</button>
</div>