搜尋

首頁  >  問答  >  主體

angular.js - angular 如何動態設定最小高度

html結構:

<body>
  <p id="header"></p>
  <p id="article"></p>
  <p id="footer"></p>
</body>

我想實現的是:給article動態設定一個min-height為:可見區域高度-header高度-footer高度,避免頁腳出現在頁面中間的情況。

我用的是angularjs,不打算引入jquery,自然無法使用$(document).ready()。

我遇到的問題有:

  1. 無法實現: 等到頁面載入完成,觸發函數動態設定高度。下列情況函數皆未執行到(window換成document也是如此):

    angular.element($window).ready(function() {});
    angular.element($window).on('load', function() {});
    angular.element($window).bind('load', function() {});
    angular.element($window).onload(function() {});
    $window.onload = function() {};
    $scope.$on('$viewcontentloaded', function() {});
    
  2. 不知把這段程式碼放在directive裡好還是放在Controller,還是什麼地方。

  3. 用css直接設定最小高度,寫死的情況(如:min-height: 400px)下,在螢幕較小時會出現捲軸。

或乾脆就不用這些方法,我的做法都是錯的,麻煩各位不吝賜教,多謝了。

phpcn_u1582phpcn_u15822744 天前765

全部回覆(1)我來回復

  • 给我你的怀抱

    给我你的怀抱2017-05-15 17:00:17

    寫一個directive吧。处理比较方便,虽然其实css的flex布局也可以解决这个问题。但根据你的疑问,还是先回答你通过angular怎麼寫吧, 直接上plunk。

    plunk怎麼看不用教吧(需要科學上網手段)

    回覆
    0
  • 取消回覆