Событие изменения размера окна в AngularJS

Я какое-то время гуглил и до сих пор нашел, как изменить размер окна с помощью директивы изменения размера окна, но в своем коде я использую window.innerHeight для получения начальной высоты. Я могу использовать его в любое время, за исключением того, что мне нужно событие, когда оно изменится. событие изменения размера окна JavaScript по какой-то причине не срабатывает. Вот мой код внутри контроллера:

function adjustH() {
    var bodyElem = document.getElementsByTagName('body')[0];
    var topP = window.getComputedStyle(bodyElem, null).getPropertyValue('padding-top');
    topP = topP.substring(0, topP.indexOf("px"));
    var bottomP = window.getComputedStyle(bodyElem, null).getPropertyValue('padding-bottom');
    bottomP = bottomP.substring(0, bottomP.indexOf("px"));
    vm.h = window.innerHeight - topP - bottomP - 20;
}

window.onresize = function(event) {
    adjustH();
}

Может ли кто-нибудь сказать мне, если это невозможно сделать таким образом, и я должен идти по директивному маршруту? Или, если это возможно, скажите мне, что мне не хватает.


javascript angularjs resize window-resize
person serge    schedule 20.11.2015    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Если вы работаете с angularJS, передали ли вы $window в качестве зависимости для вашего контроллера.

У меня были подобные проблемы с этим раньше, и это было из-за того, что зависимость не была установлена. Надеюсь это поможет.

person Tekill    schedule 20.11.2015
comment
Было бы полезно, если бы вы добавили свой контроллер angularJS и любые директивы или службы, которые вы используете. - person Tekill; 20.11.2015
comment
Ничего себе, вы правы. Но единственное, чего я не понимаю, так это почему мой window.innerHeight работал, и мне не нужно было передавать его контроллеру. - person serge; 20.11.2015
comment
Также мой холст установлен на height="{{vm.h}}", но он изменяется только при наведении курсора мыши. - person serge; 20.11.2015
comment
Опубликуйте остальную часть кода, если вы не возражаете, это поможет определить проблему... Может иметь какое-то отношение к вашим областям действия и/или распространению событий. - person Tekill; 23.11.2015

arrow_upward
-1
arrow_downward

Прочитав ваш комментарий, в котором говорилось

Также мой холст установлен на height="{{vm.h}}", но он изменяется только при наведении курсора мыши.

Кажется, вам нужно вызвать $scope.$apply() (или $rootScope.$apply()), чтобы обновить свойство высоты элемента.

Если вы добавите больше кода из своей директивы/контроллера, я могу дать вам более подробный ответ.

person Chic    schedule 29.12.2015
comment
Я попробую это и дам вам знать - person serge; 30.12.2015