Развернуть элемент страницы в модальном

У меня есть виджет на странице, который показывает Google-диаграмму для некоторых данных с парой фильтров для фильтрации данных диаграммы и со значком печати, чтобы распечатать его.

Я хочу добавить кнопку, чтобы открыть этот же виджет с графиком, фильтрами и функциями печати, работая в модальном режиме с увеличенным видом экрана. потому что виджет маленький на странице.

Я попытался добавить кнопку, и добавил функцию для этой кнопки в функции ссылки, чтобы открыть element.html() В модальном режиме HTML работал, но проблема в том, что фильтры и печать не работают.

Что случилось с element.html()? Я устал использовать $ compile, но это привело меня ко многим ошибкам. что я могу использовать?

app.directive("widget", function ($rootScope) {
        return {
                restrict: "EA",
                scope: { 
                        title: '=',
                        options: '='
                },
                transclude: true,
                templateUrl: "widget.html",
                link: function(scope, element, attrs, ctrl, transclude) {
                    scope.print = function() {....}
                    scope.filterChart = function() {....}

                    scope.expand = function() {
                      $rootScope.openModal("expand Modal", element.html(), {});      
                    } 
                }
        }

обратите внимание, что $ rootScope.openModal - это просто сервис-оболочка, который использует $ модальный сервис, принимает заголовок и тело

1 ответ

Я думаю, что у нас есть проблемы с дизайном.

Чтобы разобраться:

У вас есть логика (в вашем случае "виджет с графиком, фильтрами и функциями печати")

Эта логика должна быть реализована в directive или же component (1.5+).

Так директиву зовут widget как ты.

Эту директиву вы можете реализовать на главной странице (что вы делали до сих пор) или как часть модальной. Модал это обертка только для вашего widget, Так что создайте новый модал emplty, поместите внутрь <widget title="xx" options=someOptions></widget> на ты в порядке


Поскольку у вас есть отдельная директива области видимости, я не вижу никаких проблем, чтобы заставить ее работать.

Другие вопросы по тегам