Angular.js return scope property from modal

Question

In this Angular.js directive, I'm trying to return ng-model="commentBox" back to the controller inside of modalInstance.result.then(function(result) {} but I don't seem to be nailing it with resolve from the modal.

Directive:

angular.module('main.vips').directive('deleteButton',
    function($modal) {
        var confirmModal = function(theScope) {
            return $modal.open({
                templateUrl: '../confirm_modal.html',
                scope: theScope,
                resolve: {
                    cBox: function() {
                        return theScope.commentBox;
                    }
                },
                backdrop: false
            });
        }

      return {
        templateUrl: 'vips/directives/delete_button.html',
        restrict: "AE",
        scope: {
          'iconAttribute': "@",
        },
        controller: function($scope, $element, $attrs) {
            var modalInstance;
            $scope.cancel = function(confirmModal) {
                modalInstance.dismiss();
            }
            $scope.ok = function(confirmModal) {
                modalInstance.close();
                modalInstance.result.then(function(result) {
                    console.log(result);
                }, function() {
                    console.log("dddddddddddddD");
                });
            }
            $element.on("click", function(event) {
                modalInstance = confirmModal($scope);
            });
        }
     }
});

---

template:

<div class="modal-header" style="background-color: #E9E6E6">
    <h3 class="modal-title">Confirm</h3>
</div>
<div class="modal-body">
    <p>Your change will be logged. Please provide a ticket number or comment for reference</p>
    <div class="row">
        <div class="span4">
            <textarea type="text" class="form-control" ng-model="commentBox"></textarea>
        </div>
    </div>
</div>
<div class="modal-footer" style="background-color: #E9E6E6">
    <button type="button" class="btn btn-primary" ng-click="ok()" >OK</button>
    <button type="button" class="btn btn-primary" ng-click="cancel()">Cancel</button>
</div>

Answer 1

You probably want to structure your code like this: Scope issues with Angular UI modal or this: Scope issue in AngularJS using AngularUI Bootstrap Modal