Question

在Angular 1中，您可以将 animate-show 等CSS类与 ng-show 一起添加到元素中，但使用Angular无法做到这一点2的 ngIf ，因为隐藏时元素根本不会渲染。

Angular 1中用于animate-show的CSS：

.animate-show.ng-hide-add, .animate-show.ng-hide-remove, .animate-hide.ng-
hide-add, .animate-hide.ng-hide-remove {
    transition: all linear 0.2s;
}
.animate-show.ng-hide-add-active,
.animate-show.ng-hide-remove-active,
.animate-hide.ng-hide-add-active,
.animate-hide.ng-hide-remove-active {
  /* the transition is defined in the active class */
  transition: 1s linear all;
}
.animate-show.ng-hide-add, .animate-show.ng-hide-remove {
  transition: all linear 0.2s;
}
.animate-show.ng-hide {
  line-height: 0;
  opacity: 0;
  padding: 0 2px;
}

在Angular 1中，您只需要为元素添加一个CSS类“animate-show”，这样就可以了。

在Angular 2中有没有简单的方法来实现这一目标？

Answer 1

您可以使用ngClass有条件地应用类名，而不是Angular

例如

Sub customProperties()

    ActiveWorkbook.Sheets("Sheet1").customProperties.Add "abc123", 123
    Debug.Print ActiveWorkbook.Sheets("Sheet1").customProperties(1)     ' custom properties are not indexed by name

    ActiveWorkbook.Sheets("Sheet1").customProperties(1).Value = "this is my data"
    Debug.Print ActiveWorkbook.Sheets("Sheet1").customProperties(1)

    ActiveWorkbook.Sheets("Sheet1").customProperties(1).Delete


    ' CustomDocumentProperties Types
    ' msoPropertyTypeBoolean  2
    ' msoPropertyTypeDate     3
    ' msoPropertyTypeFloat    5
    ' msoPropertyTypeNumber   1
    ' msoPropertyTypeString   4


    ActiveWorkbook.CustomDocumentProperties.Add Name:="xyz", LinkToContent:=False, Type:=msoPropertyTypeString, Value:="xyz"
    Debug.Print ActiveWorkbook.CustomDocumentProperties("xyz")

    ActiveWorkbook.CustomDocumentProperties("xyz").Value = "abcdefg"
    Debug.Print ActiveWorkbook.CustomDocumentProperties("xyz")

    ActiveWorkbook.CustomDocumentProperties("xyz").Delete




End Sub

<强>条件

[ngClass]="'someClass'">

多个条件

[ngClass]="{'someClass': property1.isValid">

您也可以将方法作为表达式

执行

 [ngClass]="{'someClass': property1.isValid && property2.isValid}">

我希望这能满足您的需求。

如何在Angular 2中的ngIf上添加显示/隐藏动画？

1 个答案: