问题描述:

I have created a directive called modalDialog, which is basically that, a modal dialog. It uses transclude, so I can later do this in my code:

<div modal-dialog id="dialog" dialog-title="This is my Dialog">

...

here goes the content of the dialog

</div>

I want to use this directive in different places of my application, and for different purposes. The content of the dialogs will vary, naturally, so it would be very nice to have a way to pass the Controller to the directive, in the same way that I pass the dialog-title or any other parameter.

I thought about wrapping the modal-dialog in a div, with a controller set on it. Like this:

<div ng-controller="ThisInstanceController">

<div modal-dialog id="dialog" dialog-title="This is my Dialog">

...

here goes the content of the dialog

</div>

</div>

But I don't quite like it. Is there a more elegant way to do it?

网友答案:

Take a look at Angular-UI modals. They have a pretty elegant way of using modals. In short you can pass which controller you'd like to initialize when the modal opens.

$scope.open = function () {

    var modalInstance = $modal.open({
            templateUrl: 'myModalContent.html',
            controller: ModalInstanceCtrl,
            resolve: {
                items: function () {
                  return $scope.items;
                }
            } 
        });

    modalInstance.result.then(function (selectedItem) {
        $scope.selected = selectedItem;
    }, function () {
        $log('Modal dismissed at: ' + new Date());
    });
};

The nice part as well is you can pass data with the resolve between controllers.

相关阅读:
Top