Question

这是我的小提琴

我的问题是你可以看到我的指令通过设置finalValue与我的父控制器作用域进行通信，但是当触发窗口调整大小时，通过查看console.log来更新scope.finalValue，但UI不反映此更新。我试图让这个不断更新窗口大小调整。换句话说，该指令在第一次加载时成功地将scope.finalValue传递给父控制器，从而覆盖设置值5（新值是窗口的高度）。然而，当我调整大小虽然我在控制台中看到scope.finalValue更改值时，UI没有更新。

var app=angular.module('App', []);

app.controller("Ctrl1", function($scope){
    $scope.finalValue = 5;
});
app.directive('elheightresize', ['$window', function($window) {
    return {
    restrict: "EA",
    scope: false,
        link: function(scope, elem, attrs) {
            scope.onResize = function() {
                    scope.finalValue = $window.innerHeight;
                console.log(scope.finalValue);
               // var header = document.getElementsByTagName('header')[0];
               // elem.windowHeight = $window.innerHeight - header.clientHeight;
               // $(elem).height(elem.windowHeight);
            }
            scope.onResize();

            angular.element($window).bind('resize', function() {
                scope.onResize();
            })
        }
    }
}])

Answer 1

您正在使用jql绑定resize事件。 jql是非常低级的，并且直接将处理函数绑定到元素，绕过正常的角度脏检查。为了使角度感知非角度事件处理程序，你需要在事件处理程序中调用scope。$ apply（），让angular知道它需要运行一个摘要周期。

角度指令的父范围不更新UI

1 个答案: