Angular Nativescript 可见性默认为 true，即使变量已初始化

Question

有没有办法默认 "hide" Nativescript 中的元素？

我的组件中有

export class HouseholdContactComponent{
  private isLoading = true
}

在我的 xml

<StackLayout [visibility]="isLoading ? 'collapse' : 'visible'">
  <Label text="Hi there"></Label>
</StackLayout>

使用此代码，屏幕会闪烁 "Hi there" 消息然后消失。

Answer 1

与其使用 [可见性] 属性，不如使用 Angular *ngIf 指令。

<StackLayout *ngIf="!isLoading">
    <Label text="Hi there"></Label>
</StackLayout>

附带说明一下，为了绑定到属性属性并将其绑定到插值 Angular，您需要在它前面加上前缀 attr，例如您会需要写 [attr.visibility] 而不仅仅是 [visibility].

Answer 2

使用*ngIf directive。如果变量值为 true.

，它将呈现

例如：

//HTML
<Button text="Show/hide block" (tap)="onTap()" class="btn btn-primary btn-active"></Button>
<GridLayout *ngIf="isVisible" class="bg-primary" borderRadius="2" height="300"></GridLayout>

//Component
...
    onTap() {
        if (this.isVisible) {
            this.isVisible = false;
        } else  {
            this.isVisible = true;
        }
    }
...

Angular Nativescript 可见性默认为 true，即使变量已初始化

Angular Nativescript visibility defaults to true, even when variable is initialized

nativescript

angular2-nativescript

angular