Question

基于这个小提琴https://jsfiddle.net/vuwgnfqw/1/，textareas的高度怎么能达到旗帜高度的50％？这应该允许堆叠的textareas与旗帜一样高。你看，如果视口太窄，textareas太高了，如果视口太宽，标志就会更高。

我使用此代码how to set dynamically height to element?来修改角度高度，但到目前为止它不是动态的，如果页面调整大小，它会相应地自动调整大小。基本上我犯了将DOM操作添加到控制器只是为了看它是否有效

.controller('main', ['$scope', function ($scope) {
    var element = angular.element(document.querySelector('#flag'));
    $scope.height = element[0].offsetHeight;
}]);

并在HTML中

<textarea class="playerName" rows="1" placeholder="APELLIDO" ng-style="{height: (height/2)-10 + 'px'}"></textarea>

这很有用，但它不会在页面调整大小时自动刷新。

Answer 1

我将提供一个javascript解决方案（不是很多角度专家）

将一个名为target的类添加到textarea标记及其父级。

同时对这些目标应用overflow:hidden属性（如果窗口太小，您将看不到溢出内容）

检测窗口调整大小并计算保存图像的div的宽度。

计算宽度的一半并将其应用于目标

fiddle here

如何将元素高度调整为另一个元素的高度？

1 个答案: