Html 将更多项目添加到菜单时，将“内容分区高度”扩展到“左菜单高度”

我有一个左菜单，可以在其中添加或删除项目。右侧有一个最小高度的内容div

当使用angular将更多项目添加到左侧菜单时，如果左侧菜单高于其最小高度，我希望content div将其高度扩展到左侧菜单

还有一件事是，我还希望为content div提供ng animate的下拉效果

这里是小提琴链接：

var-app=angular.module（'myApp'，['ngAnimate']）；
应用程序控制器（'myCtrl'，函数（$scope）{
$scope.items=['foo'，'bar']；
var num=0；
$scope.add=函数（）{
$scope.items.push（num）；
num++；
}
});
#左{
宽度：25%；
背景颜色：浅蓝色；
浮动：左；
}
#对{
宽度：75%；
浮动：左；
背景颜色：浅绿色；
最小高度：200px
}
.项目{
高度：20px；
不透明度：1；
过渡：0.5s；
}
.item.ng-enter{
不透明度：0；
身高：0；
}
.item.ng-enter-active{
高度：20px；
}


{{item}}

添加
{{names}}
使用jQuery：

$("#right").css({'height': $("#left").outerHeight()});

它会将#right的高度设置为#left的外部高度。
因此我将回答我的问题。我使用ng style指令成功地做到了这一点：


然后在控制器中：

$scope.hgt=$（“#左”）.outerHeight（）+40

不需要使用jQuery或
ng样式进行黑客DOM操作。只需将
display:flex
添加到包装器：

#wrapper {
    display: flex;
}


使用flexbox还可以删除浮动：

#left {
    width: 25%;
    background-color: lightblue;
}

#right {
    width: 75%;
    background-color: lightgreen;
    min-height: 200px
}

有关更多信息，请参阅此文档。
它似乎不起作用，您可以将其添加到我的小提琴中吗？您需要添加到jquery的链接。我不太懂angular，也不知道如何将jquery添加到angular中，谷歌也许你可以找到一种方法。这不是一种实现你想要的东西的好方法。您正在从控制器内部操纵DOM，这在角度上是一件非常糟糕的事情。有关更好的解决方案，请参见我的答案。角度：中的DOM操作最佳实践。