Question

在这个Angular.js指令中，我试图将ng-model="commentBox"返回到modalInstance.result.then(function(result) {}内部的控制器，但我似乎没有用resolve从{模态的。

指令：

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);
            });
        }
     }
});

模板：

<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

您可能希望按照以下方式构建代码：Scope issues with Angular UI modal或者：Scope issue in AngularJS using AngularUI Bootstrap Modal

Angular.js从modal返回scope属性

1 个答案: