Question

在nativescript angular应用程序中隐藏tabViewItems的推荐方法是什么？

我尝试将ngIf指令与w-ng-template结合起来，但似乎并没有完全支持它。

这是我正在使用的代码

<TabView [selectedIndex]="auth.user ? 2 : 4" class="tab-view" sdkExampleTitle sdkToggleNavButton>
      <!--shown when logged in-->
      <ng-template [ngIf]="auth.user">
        <!--notifications tabs-->
        <StackLayout *tabItem="{title: 'notifications', iconSource: 'res://ic_action_home'}">
          <Label text="NativeScript" class="m-15 h2 text-left" color="blue"></Label>
          <ScrollView>
            <Label text="content" textWrap="true" class="m-15"></Label>
          </ScrollView>
        </StackLayout>
        <!--messages tabs-->
        <StackLayout *tabItem="{title: 'Messages', iconSource: 'res://ic_action_home'}">
          <Label text="NativeScript" class="m-15 h2 text-left" color="blue"></Label>
          <ScrollView>
            <Label text="content" textWrap="true" class="m-15"></Label>
          </ScrollView>
        </StackLayout>
      </ng-template>
      <StackLayout *tabItem="{title: 'People', iconSource: 'res://ic_action_home'}">
        <Label text="NativeScript" class="m-15 h2 text-left" color="blue"></Label>
        <ScrollView>
          <Label text="content" textWrap="true" class="m-15"></Label>
        </ScrollView>
      </StackLayout>
      <StackLayout *tabItem="{title: 'Home', iconSource: 'res://ic_action_home'}">
        <RadListView [items]="announcementService.announcements" loadOnDemandMode="Auto" class="list-group">
          <ListViewLinearLayout tkListViewLayout scrollDirection="Vertical" itemInsertAnimation="Slide" itemDeleteAnimation="Default">
            <ng-template tkListItemTemplate let-item="item">
              <GridLayout class="list-group-item" rows="*" columns="auto, *">
                <Image row="0" col="0" decodeWidth="60" decodeHeight="60" loadMode="async" src="res://icon" class="thumb img-rounded"></Image>
                <StackLayout row="0" col="1">
                  <Label [text]="item.title" textWrap="true" class="list-group-item-heading"></Label>
                  <Label class="list-group-item-text" [text]="item.createdAt | amTimeAgo"></Label>
                </StackLayout>
              </GridLayout>
            </ng-template>
          </ListViewLinearLayout>
        </RadListView>
      </StackLayout>
    </TabView>

将ng-template与ngIf一起使用时，它首次运行，但在重新加载应用程序后，它不再起作用了。

我试过[visibility] =＆＃34; ..条件..？＆＃39;可见＆＃39;：＆＃39;崩溃＆＃39;＆＃34;，它没有用。

我做错了什么？

Answer 1

这样的事情可行：

<ng-container *ngIf="isLoggedIn()">
  <StackLayout>
    // ...
  </StackLayout>
</ng-container>

如何隐藏nativescript（angular）条件中的tabitems？

1 个答案: