Question

我正在做角度的画廊，这个画廊有一个灯箱视图，当点击一个画廊项目时，它会显示带有深色背景的图像。

现在我在控制器中有代码可以像这样做：

$scope.modal = function (iElement) {
    var darkDiv = angular.element('<div class="modal__dark-background"></div>');
    var body = angular.element(document).find('body');
    var overlay = $compile(darkDiv)($scope);
    body.prepend(overlay);
}

我还有一个指令将我的主模板插入自定义元素中：

myApp.directive('gallery', function() {
    return {
        restrict: 'E',
        templateUrl: 'partials/gallery.template.html'
    }
})

我的问题是我不知道如何制作一个具有控制器内部代码功能的指令。我想这样做是因为我将收集DOM相关代码放在控制器中并不是一个好主意。

Answer 1

不幸的是，我没有足够的代表发表评论。

但对于模态元素的情况，我不知道如何做这个。

究竟做什么？你想让指令执行上面的代码吗？试试这个：

myApp.directive('gallery', function($scope) {
    return {
        restrict: 'E',
        templateUrl: 'partials/gallery.template.html',
        controller: function(){
            $scope.modal = ...
        }
    }
})

此外，我会考虑使用ui.bootstrap或类似的任务。

角。将元素添加到正文，从控制器更改为指令

1 个答案: