AngularJS/CSS (No jQuery)

Question

AngularJS newbie kullanarak belirli bir alan yüksekliği için hesaplama. AngularJS ve/veya CSS kullanarak sayfadaki belirli bir alanı hesaplamanın bir yolu var mı?

Temel olarak, elde etmeye çalıştığım şey, gezinme menüsünün son öğesinin altındaki boş alanı doldurmaktır. Altbilgiyle örtüşmesini istemiyorum. Bunun için hesaplamak istediğim nedeni, kullanıcının sayfadan uzaklaştığı zaman ayarlamasıdır.

Bu benim daha önceki girişimi oldu:

HTML

<div class="blankSpace"> 

CSS

div.blankSpace { 
    background-color: #35444f; 
    background-repeat: repeat-y; 
} 

... ama bu işe yaramadı

Herhangi bir ipucu çok takdir edilecektir.

Teşekkür ederiz.

Answer 1

Bunu css3 veya Angular yönergesini kullanarak yapabilirsiniz.

// CSS

// bilgisinin üstbilgi ve altbilgi yüksekliği sırasıyla 100px vardır varsayalım.

#sidebar { 
height: -moz-calc(100% - (100px + 100px)); 
height: -webkit-calc(100% - (100px + 100px)); 
height: calc(100% - (100px + 100px)); 

}

yourAppName.directive('sidebar', ['$document', '$window', function ($document, $window) { 

    return { 
     restrict: 'AE', 
     link: function (scope, element, attrs) 
     { 
      angular.element(document).ready(function() { 
       var headerHeight = 100px; 
       var footerHeight = 100px; 

       var d = $document.height() - headerHeight - footerHeight; 


       scope.changeHeight = function() { 
        element.css('min-height', d); 
        console.log(d); 
       }; 
       scope.changeHeight(); 
      }); 
     } 
    }; 
}]); 

// HTML Kod Veya Direktifi

<aside sidebar></aside>