angular.js - angular 如何动态设置最小高度
phpcn_u1582
phpcn_u1582 2017-05-15 16:58:17
0
1
767

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_u1582
phpcn_u1582

membalas semua(1)
给我你的怀抱

Tulis satudirective. Pemprosesan lebih mudah, walaupun sebenarnya flex susun atur css juga boleh menyelesaikan masalah ini. Tetapi mengikut soalan anda, mari kita jawab dahulu cara anda menulisnya melalui angular, dan pergi terus ke plunk.

plunkAnda tidak perlu diajar cara menontonnya (memerlukan akses Internet saintifik)

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan