首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在离子条件下设定高度?

如何在离子条件下设定高度?
EN

Stack Overflow用户
提问于 2020-09-29 07:50:22
回答 1查看 510关注 0票数 1

我想在我的组件上有条件地设置高度,这样点击它就会展开。但我想不出如何有条件地设定高度。

组件的Html:

代码语言:javascript
运行
复制
<div class="elements-container">
  <div class="section-text-container">
    <ion-label class="heading-label">
      {{ item.name }}
    </ion-label>
    <ion-label class="label">{{ item.data }}</ion-label>
    <ion-label class="label" *ngIf="item.expanded === true">{{
      item.status
    }}</ion-label>
    <ion-label class="label" *ngIf="item.expanded === true">{{
      item.type
    }}</ion-label>
  </div>
  <ion-icon
    class="item-icon"
    name="chevron-down-outline"
    *ngIf="item.expanded === false"
  ></ion-icon>
  <ion-icon
    class="item-icon"
    name="chevron-up-outline"
    *ngIf="item.expanded === true"
  ></ion-icon>
</div>

我的组件的css:

代码语言:javascript
运行
复制
.elements-container {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  background: white;
  margin: 0px 5vw 10px 5vw;
  border-radius: 25px;
  border-color: var(--ion-color-primaryBlackGradient);
  border-style: solid;
  border-width: 1px;
  width: 80vw;
  height:89px;
}

如果有人知道,那么请分享你的想法。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-09-29 07:54:43

它可以通过以下方式进行:

  • 首先从元素中删除高度容器css类.

然后在组件的html文件中,将其更改为:

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/64115148

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档