AngularJS根据宽度动态更改高度

AngularJS Dynamically change height based on width

本文关键字：高度 动态 AngularJS      更新时间：2023-09-26

我有一个通过ng-repeat打印的表，我的目标是使tbody中的每个td都是正方形。所有td的宽度都相等，所以我只需要检查第一个就可以进行更改。但是，页面是动态的，因此table的宽度以及td的宽度将在窗口调整时发生变化

我有head中的样式表。

<style type="text/css">.squerify>tr{height:60px;}</style>


这用于通过以下方式更改高度：

document.styleSheets[1].cssRules[0].style.height=document.querySelector('.squerify td').offsetWidht+"px";

这本身就起作用，但我想知道如何从角度告诉我，td已经改变了它的宽度（这里我想到的是窗口上的'onresize'事件）

onresize现在可能可以工作了，但初始化怎么样
我没有找到一种方法让angular告诉我它完成了所有的工作
PS.：表格在视图中，如果这改变了什么

问题如下：

  • 有没有更好的方法来检查页面是否按角度调整大小
  • 表的初始化使用什么

对于所有想知道如何制作正方形元素的人：

  1. 我们需要一个基本元素（div会这样做）给它类（我会使用正方形），这个元素将是正方形的：

    <div class="square"></div>

  2. 我们在里面放了一个img标签：（需要"data:…"，不要删除它，它是1x1px透明img）

  3. 我们需要一点css：

    .square img{
    width: 100%;
    height: auto;
    border: 0;
}
.square *:not(img){
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
  4. 就是这样，简单吧
相关文章：