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

Question

我有一个名为 top 和 bottom 的输入参数，正如他们所说，是 CSS 中的顶部和底部。当我将组件 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 或其他东西

Answer 1

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

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

NgStyle in Angular 2+ does not taking in consideration 0(zero) from input parameter

html

css

ng-style

angular2-template

angular