【发布时间】:2018-10-12 16:41:12
【问题描述】:
两天前我问了关于ListView 的问题,但现在我发现核心问题不是关于listview,而是问题出在TabView。在创建选项卡的开始时,一切看起来都很好,但是当我点击添加另一个选项卡的按钮时,它无法正常工作。添加了选项卡(最后)并且选项卡的选定索引为 2,但前一个选项卡的内容(选项卡索引 1)消失了。但是当我转到最后一个标签(索引 3)并返回标签(索引 1)时,内容就在那里。
这里是代码sn-p,你可以试试:
Home.component.ts
import { Component, OnInit, NgZone } from "@angular/core";
import { Page } from "tns-core-modules/ui/page/page";
import { ListView } from "ui/list-view"
@Component({
selector: "app-home",
moduleId: module.id,
templateUrl: "./home.component.html",
styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
site = [{ "name": "cau 1", }, { "name": "cau 2" },
{ "name": "settings" }];
tabSelectedIndex = 0;
onItemTap(args) {
this.ngZone.run(() => {
this.site.push({ "name": "next" });
this.tabSelectedIndex = 2;
});
}
constructor(private ngZone: NgZone, private page: Page) {
}
ngOnInit(): void {
}
onTabChanged(args) {
console.log("ahoj");
}
}
Home.component.html
<ActionBar title="YOUR APP"></ActionBar>
<GridLayout class="page">
<TabView [(ngModel)]="tabSelectedIndex" height="100%" (selectedIndexChange)="onTabChanged($event)" class="content p-20">
<ng-template ngFor let-item [ngForOf]="site">
<StackLayout *tabItem="{title: item.name}">
<Label row="0" col="0" [text]="test"></Label>
<Button text="+" class="btn btn-active tmp" (tap)="onItemTap($event)"> </Button>
</StackLayout>
</ng-template>
</TabView>
</GridLayout>
仅在安卓模拟器上测试。
附加问题:是否可以将新标签添加为第一个(到索引 0)?
非常感谢您的宝贵时间和任何答复。
编辑:这个代码你可以试试here
或者更好的示例是here
【问题讨论】:
-
你的意思是“有没有办法把东西放在数组的前面”?您似乎正在使用
.push,它总是附加到数组中。this.site.unshift({ "name": "next" })做你想做的事吗? -
我知道 unshift 功能......但遗憾的是它没有将选项卡作为 TabView 中的第一个选项卡。这是我尝试的第一件事 :) 但这只是附加问题...第一个更重要...顺便说一句,问题中的代码可以尝试:nativescript-playground
-
您必须使用那里的“保存”功能来获取可共享的 URL。
-
谢谢... :) Here is it
标签: angular typescript nativescript angular2-nativescript nativescript-angular