TabView not rendering
還沒有人認領這個 Issue。
評估
- 難度
- 3/5
- 預估耗時
- 1-2 天
- 新手友好度
- 45/100
- Issue 類型
- 缺陷
- 描述清晰度
- 描述清楚
- 活躍度
- 停滯
- 技術堆疊
- angular, typescript
研究方向
從連結的 StackBlitz 和 src/app/item/items.component.html 中的重現開始,然後將其與 master-detail Angular 教學進行比較。使用列出的 Angular 和 NativeScript 版本執行範例,並追蹤 TabView 未出現的原因。當三個分頁如預期圖片所示呈現其標籤和內容時,即表示完成。
由索引模型根據 Issue 內容生成。
描述
Environment
Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project):
{
"name": "stackblitz-nativescript-angular",
"main": "./src/main.ts",
"version": "1.0.0",
"private": true,
"dependencies": {
"@angular/animations": "~19.0.0",
"@angular/common": "~19.0.0",
"@angular/compiler": "~19.0.0",
"@angular/core": "~19.0.0",
"@angular/forms": "~19.0.0",
"@angular/platform-browser": "~19.0.0",
"@angular/platform-browser-dynamic": "~19.0.0",
"@angular/router": "~19.0.0",
"@nativescript/angular": "^19.0.0",
"@nativescript/core": "~8.8.0",
"rxjs": "~7.8.0",
"zone.js": "~0.15.0"
},
"devDependencies": {
"@angular-devkit/build-angular": "~19.0.0",
"@angular/compiler-cli": "~19.0.0",
"@nativescript/preview-cli": "^1.0.14",
"@nativescript/stackblitz": "^0.0.8",
"@nativescript/tailwind": "^2.1.0",
"@nativescript/types": "~8.8.0",
"@nativescript/webpack": "~5.0.0",
"@ngtools/webpack": "~19.0.0",
"tailwindcss": "~3.4.0",
"typescript": "~5.6.0"
}
}
Describe the bug
Adding TabView UI component doesn't render on the page.
To Reproduce
Start new project by following the docs: https://docs.nativescript.org/tutorials/build-a-master-detail-app-with-angular. or use this stackblitz:
https://stackblitz.com/edit/nativescript-stackblitz-templates-t6bujanb?file=src%2Fapp%2Fitem%2Fitems.component.html,src%2Fapp%2Fitem%2Fitems.component.ts,src%2Fapp%2Fapp.routes.ts&title=NativeScript%20Starter%20Angular
Modify items.component.html
<ActionBar title="My App"> </ActionBar>
<GridLayout>
<TabView>
<TabViewItem title="First">
<Label
text="First Tab Content"
textAlignment="center"
verticalAlignment="center"
></Label>
</TabViewItem>
<TabViewItem title="Second">
<Label
text="Second Tab Content"
textAlignment="center"
verticalAlignment="center"
></Label>
</TabViewItem>
<TabViewItem title="Third">
<Label
text="Third Tab Content"
textAlignment="center"
verticalAlignment="center"
></Label>
</TabViewItem>
</TabView>
</GridLayout>
Expected behavior
Tab views to load like the bellow:
Sample project
Additional context
- 主要語言
- TypeScript
- 星號
- 55
- 分支
- 13
- 平均合併
- 16 分鐘
- 30 天內合併 PR
- 1
貢獻指南
從這裡開始
- 先讀完整個 Issue,再讀專案的貢獻指南。
- 在 Issue 下留言說明你要接手 —— 這能避免兩個人做同樣的事。
- Fork 儲存庫,在一個分支上完成修改。
- 送出 Pull Request,並在描述裡引用這個 Issue 編號。
NativeScript/angular 的其他 Issue
-
難度 4/5 3-5 天 新手友好度 45/100
NativeScript/angular#170 · 1 則留言 ·
-
難度 5/5 一週以上 新手友好度 35/100
NativeScript/angular#164 ·
-
難度 2/5 1-3 小時 新手友好度 45/100
NativeScript/angular#163 · 1 則留言 ·
-
難度 4/5 3-5 天 新手友好度 38/100
NativeScript/angular#158 · 1 個 reaction ·
-
難度 2/5 1-3 小時 新手友好度 35/100
NativeScript/angular#155 ·
查看 NativeScript/angular 的全部 Issue
相似的 Issue
-
bug
難度 2/5 1-3 小時 新手友好度 72/100
-
難度 1/5 1 小時以內 新手友好度 85/100
-
check:passed streams:add
難度 2/5 1-3 小時 新手友好度 68/100
-
難度 2/5 1-3 小時 新手友好度 76/100
-
難度 2/5 1-3 小時 新手友好度 68/100