Остановить вызов контроллера $ mdPanel после открытия - PullRequest
Новая
       10

Остановить вызов контроллера $ mdPanel после открытия

0 голосов
/ 17 января 2020

В моем приложении AngularJS я использую сервис $mdPanel для предоставления панели фильтров. Служба вызывается, когда пользователь нажимает кнопку, и когда пользователь выбирает параметр фильтра, он обновляет таблицу и предоставляет чип фильтра (пользователи могут видеть то, что они выбрали) в заголовке таблицы.

просмотр - таблица 

<md-button data-ng-click="$ctrl.showFilter($event)">
     Filter
</md-button>

просмотр - панель фильтра 

<div>
    <md-list ng-repeat="cat in categories">

    </md-list>
    <div>
        <md-button data-ng-click="closeDialog();">
            Close
        </md-button>
    </div>
</div>

контроллер 

var panelRef;

function showFilter($event) {
    var config = {
        attachTo: angular.element(document.body),
        controller: ['mdPanelRef', '$scope', function(mdPanelRef, $scope) {

          //LOGIC TO FILTER TABLE DATA AND PROVIDE SELECTED FILTER OPTION GOES HERE

        }],
        controllerAs: '$ctrl',
        targetEvent: $event,
        templateUrl: 'app/templates/portfolio/filter-panel.tpl.htm',
        clickOutsideToClose: true,
        escapeToClose: true,
    };

    $mdPanel.open(config)
    .then(
        function(result) {
            panelRef = result;
        },
        function(error){

        }
    );
}

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

Вопрос

Как мне поддерживать один экземпляр mdPanel с первоначального открытия? Пользователь может открывать и закрывать его сколько угодно, но все значения в контроллере сохраняются

1 Ответ

0 голосов
/ 20 февраля 2020

Вы можете попытаться сохранить отфильтрованные данные в родительском контроллере. 

(parent controller)
$scope.filterData = {};

Затем передайте данные фильтра с помощью функции showFilter($event). 

(view -table)
<md-button data-ng-click="$ctrl.showFilter($event, filterData)">
 Filter
</md-button>

Затем попробуйте использовать locals в файле конфигурации. 

(panel controller)
var panelRef;

function showFilter($event, filterData) {
    var config = {
        attachTo: angular.element(document.body),
        controller: ['mdPanelRef', '$scope', 'filterData' function(mdPanelRef, $scope, filterData) {

          //LOGIC TO FILTER TABLE DATA AND PROVIDE SELECTED FILTER OPTION GOES HERE

        }],
        controllerAs: '$ctrl',
        targetEvent: $event,
        templateUrl: 'app/templates/portfolio/filter-panel.tpl.htm',
        clickOutsideToClose: true,
        escapeToClose: true,
        locals: {
            filterData: filterData //add local
        }
    };

    $mdPanel.open(config)
    .then(
        function(result) {
            panelRef = result;
        },
        function(error){

        }
    );
}
...