Как открыть md-sidenav на загрузке состояния ui-роутера? (Не открыть замок)

Question

Как открыть md-sidenav на загрузке состояния ui-роутера? (Не открыть замок)

0

У меня есть md-sidenav, который должен быть открыт в некоторых состояниях ui-router, но не должен в других. Я хочу, чтобы он был не только открытым, но и анимированным открытием/закрытием между государствами. В идеале я хотел бы иметь функцию, которая открывает sidenav при загрузке состояния/представления.

Я пытался сделать это так:

<md-sidenav md-component-id="secondarySidenav" md-disable-backdrop ng-init="handleSecondary()">

с проверкой функции $ state и открытием или закрытием соответственно, но это не сработало вообще и недействительно. Использование ng-init я думаю.

Затем я сделал это так:

<md-sidenav md-component-id="secondarySidenav" md-disable-backdrop md-is-open="handleSecondary()">

с функцией проверки $ state и возвратом логического значения. Он работает, но sidenav заблокирован открытым или закрытым, фактически не открывается/закрывается между состояниями.

Я также пробовал некоторые функции внутри контроллера, но не мог понять, как запустить их в нужный момент. Есть ли какое-то событие после загрузки $ state, к которому я мог бы подключить свою функцию?

Как сделать sidenav анимацией, как предполагалось?

Senthe 19 апр. 2016, в 15:32

Источник

Теги:

angularjs

angular-material

angular-ui-router

1 ответ

Ещё вопросы

Ant Kennedy · Answer 1 · 2016-04-19T11-28-00.000Z

Я подозреваю, что это связано с тем, что вы связываете md-is-open с возвращаемым значением функции. Это модель, с которой теперь связано md-is-open.

Модель, возвращенная из этой функции, никогда не изменится (в простом случае). Вместо этого вы должны привязываться к переменной в области.

Что-то вроде этого.

<md-sidenav md-component-id="secondarySidenav" md-disable-backdrop md-is-open="secondaryOpen">

С помощью вашей функции, управляющей переменной

function exampleController($scope, $timeout) {
    $scope.secondaryOpen = false;


    // function for manipulating the sidenav, doesn't have
    // to be attached to $scope if it is not going to be called
    // outside of the enclosing controller func
    $scope.toggleSecondarySideNav = function() {
        $scope.secondaryOpen = !$scope.secondaryOpen;

        // in your function you would manipulate the
        // $scope.secondaryOpen based on the $state;
    }

    // every 5 seconds toggle the sidenav, again in
    // your instance you would just call the function
    $timeout($scope.toggleSecondarySideNav, 5000);
}
exampleController.$inject = ['$scope', '$timeout'];
angular
  .module('example-module')
  .controller('ExampleController', exampleController);

Мне не ясно, когда я должен вызывать эту функцию, которая меняет переменную. Когда я вызываю его внутри контроллера, переменная устанавливается задолго до того, как элемент загружается, и он загружается открытым или не открытым - не анимируется.