时间戳

首页 > 解决方案 > Angular 2+ 中的 NgStyle 不考虑输入参数中的 0（零）

html - Angular 2+ 中的 NgStyle 不考虑输入参数中的 0（零）

问题描述

我有一个名为 top 和 bottom 的输入参数，正如他们所说，它是 CSS 中的 top 和 bottom。当我将组件 0 中的输入添加到顶部时，CSS 样式中不存在 0。例如顶部：0px 没有显示在那里。

<k-sidebar [id]="'testId'" 
  [attachToBody]="true"
  [top]="0"
  [bottom]="60"
  [sideBarMode]="'sliding'"
  [sideBarSide]="'right'" 
  [clickOutsideSidebar]="true" 
  [theme]="theme.dark" 
  [sideBarOverlap]="false"
  [scrollable]="true"
  [sideBarWidth]="'377px'"
  [selfToggle]="true">
    <!--<ng-template kennedysSidebar>
      This is a template passed
    </ng-template> -->
  </k-sidebar>

而HTML组件的ngStyle是这样的。

[ngStyle]="{'width.px': sidebar.isDesktopWidth ? sideBarWidth : '',
         'margin-bottom.px': marginBottom ? marginBottom : '',
         'margin-top.px': marginTop ? marginTop : '',
         'top.px': top ? top : '',
         'bottom.px': bottom ? bottom : ''}"

底部我可以在 CSS 中看到它为 60px，但是，当我通过 0（零）时，它在 CSS 中不存在。任何想法为什么会发生这种情况？我猜 top(input) 被视为 null 什么的

标签： htmlcssangularangular2-templateng-style

解决方案

因为 0 是一个假值。条件top ? top : ''将始终返回 false

推荐阅读