Javascript AngularJS'$手表'；值更改时不触发

我有一个web应用程序，必须以横向方向查看

为此，我创建了一个函数，用于检查

innerWidth

和

innerHeight

，如果宽度大于高度，则检查快乐日子。这在我加载页面时非常有效，但在触发

resize

事件时，我还需要检查方向

所以我的代码流程是-

触发事件调用

$scope.getorientation（）

计算当前方向并返回结果

使用

监视
$scope.getorientation（）值的更改，并更新
$scope.orientation的值

上面的步骤1和2似乎工作正常，但my

watch

从未检测到对

$scope.GetOrientation（）

的更改，并且仅在页面加载时触发。我一定是做错了什么，谁能帮我找出问题所在吗

以下是相关的AngularJS-

christmasApp.controller('bodyCtrl', function($scope, $window){

    angular.element($window).bind('resize', function(){
        console.log('Event triggered');
        $scope.getOrientation();
    });

    $scope.getOrientation = function(){

        var w = $window.innerWidth,
            h = $window.innerHeight;
        var orientation = (w > h) ? 'landscape' : 'portrait'
        console.log('Function triggered - ' + orientation)
        return (w > h) ? 'landscape' : 'portrait';

    };

    $scope.$watch($scope.getOrientation, function(newValue, oldValue){
        $scope.orientation = newValue;
        console.log('Watch triggered - ' + newValue);
    }, true);

});

下面是一个HTML，它有一个条件类集，这取决于

$scope.orientation

的值（可能不相关，但只是以防万一）-

---

从
resize
事件调用
getOrientation
时，只执行
getOrientation
代码，但并不意味着某些内容已更改。所以您需要在
$scope
上调用
$apply（）
，告诉angular运行摘要循环。调用digest cycle后，angular将计算所有
$watcher
s，并且将计算you watcher函数

实际上，来自
resize
事件的
getOrientation
方法调用似乎没有做任何与范围级别绑定相关的事情。因此，您可以从那里删除
getOrientation
方法，因为它看起来像是在调用一个什么都不做的代码

代码

angular.element($window).bind('resize', function(){
    console.log('Event triggered');
    $scope.getOrientation(); //you could remove this method, as its not modifying any scope
    //will run digest cycle, and the watcher expression will get evaluated
    $scope.$apply(); //you could also use $timeout(function(){}) here run safe digest cycle.
});

你为什么不听听这样的“方向改变”活动呢

    window.addEventListener("orientationchange", function() {
            switch(window.orientation){  
            case -90:
            case 90:
                $rootScope.orientation = "landscape";
                break; 
            default:
                $rootScope.orientation = "portrait";
            break; 
            };

    }, false);

宾果，谢谢你的迅速回复。只要我被允许，我会尽快给你的答案打上正确的标记。@DavidGard很高兴能帮助你..看看我答案中的编辑..这将澄清你关于观察者的概念。。谢谢：）我会关注那个事件，但如果我不需要访问
$rootScope
，我真的不喜欢这个想法。你不需要。一旦事件触发，您还可以操纵
$scope.orientation
或任何您喜欢的操作。公平竞争我会将其添加到我的列表中。
    window.addEventListener("orientationchange", function() {
            switch(window.orientation){  
            case -90:
            case 90:
                $rootScope.orientation = "landscape";
                break; 
            default:
                $rootScope.orientation = "portrait";
            break; 
            };

    }, false);