如何使用 AngularJS 获取视口的尺寸？

在本文中，我们将看到如何在 AngularJS 中获取 Viewport 的尺寸。

方法：

• 方法是使用clientWidth 和 innerWidth 属性。
• 这些值的最大值应该分别是宽度和高度。

示例 1：在此示例中，以像素为单位计算高度和宽度。

HTML

 

  

    
    
  
    
        var myApp = angular.module("app", []);
            myApp.controller("controller", function($scope) {
            $scope.height = '';
            $scope.width = '';
            $scope.getVPDimnsn = function() {    
                $scope.width = 
                    Math.max(document.documentElement.clientWidth,
                            window.innerWidth || 0)
                $scope.height = 
                    Math.max(document.documentElement.clientHeight,
                            window.innerHeight || 0)
                };
            });
    
 
  

      
        GeeksForGeeks  
     
  
      
    
        How to get the dimensions of the 
        Viewport in AngularJS
    
  
      
        
            
                Click here
            
            
            Height of viewport = {{height}}px
            
            Width of viewport= {{width}}px
            
         
    
   
    

输出：

示例 2：在此示例中，高度和宽度以厘米为单位计算。

HTML

 

  

    
    
  
    
        var myApp = angular.module("app", []);
            myApp.controller("controller", function($scope) {
            $scope.height = '';
            $scope.width = '';
            $scope.getVPDimnsn = function() {    
                $scope.width = 
                    Math.max(document.documentElement.clientWidth,
                            window.innerWidth || 0)
                $scope.height = 
                    Math.max(document.documentElement.clientHeight,
                            window.innerHeight || 0)
                };
            });
    
 
  

      
        GeeksForGeeks  
     
  
      

        How to get the dimensions of the Viewport in AngularJS
    
  
      
        
            
                Click here
            
            
            
            Height of viewport = {{height * 2.54 / 96}}cm
            
            Width of viewport= {{width * 2.54 / 96}}cm
            
         
    
   
    

输出：