Angularjs 为什么爱奥尼亚需要一个/选项卡/";URL中的前缀?
我想做一个简单的爱奥尼亚应用程序,在底部有一个导航栏。经过大量的研究,我终于成功了。然而,我不明白两件事: #1。在我的routes.js文件中,选项卡状态在那里做什么,为什么我需要在我的主状态前面加前缀?Angularjs 为什么爱奥尼亚需要一个/选项卡/";URL中的前缀?,angularjs,angular-ui-router,ionic-framework,ionic,Angularjs,Angular Ui Router,Ionic Framework,Ionic,我想做一个简单的爱奥尼亚应用程序,在底部有一个导航栏。经过大量的研究,我终于成功了。然而,我不明白两件事: #1。在我的routes.js文件中,选项卡状态在那里做什么,为什么我需要在我的主状态前面加前缀? // Why do I need the tabs. part in my state? $stateProvider.state('tabs.home', { url: '/home', views: { "home-tab": {
// Why do I need the tabs. part in my state?
$stateProvider.state('tabs.home', {
url: '/home',
views: {
"home-tab": {
templateUrl: 'templates/home/index.html'
}
}
})
// Why do I even need this state?
.state('tabs', {
url: "/tab",
abstract: true,
templateUrl: "templates/tabs.html"
})
<!-- Why do I need the /tab/ part in the href? -->
<ion-tab title="Home" icon="ion-home" href="#/tab/home">
<ion-nav-view name="home-tab"></ion-nav-view>
</ion-tab>
#2。每当我创建锚定链接或离子标签链接时,我总是必须在哈希前面加上/tab/。为什么?
// Why do I need the tabs. part in my state?
$stateProvider.state('tabs.home', {
url: '/home',
views: {
"home-tab": {
templateUrl: 'templates/home/index.html'
}
}
})
// Why do I even need this state?
.state('tabs', {
url: "/tab",
abstract: true,
templateUrl: "templates/tabs.html"
})
<!-- Why do I need the /tab/ part in the href? -->
<ion-tab title="Home" icon="ion-home" href="#/tab/home">
<ion-nav-view name="home-tab"></ion-nav-view>
</ion-tab>
我得承认:我还没有真正研究过爱奥尼亚公司或美国的供应商。如果有人能链接到ionic或$stateProvider的教程,我将非常感激。您需要一个抽象状态,因为您正在处理嵌套视图。(您有一个导航栏和视图主页) 您使用/tab/home是因为您将进入状态tabs.home。如果您在tab和list中有另一个状态,您将使用/tab/list访问它。您正在呈现两个模板:选项卡和索引 请阅读以下内容: 更多视图的示例:
$stateProvider
.state('tabs', {
url: "/tab",
abstract: true,
templateUrl: "templates/tabs.html"
})
.state('tabs.home', {
url: "/home",
views: {
'home-tab': {
templateUrl: "templates/home.html",
controller: 'HomeTabCtrl'
}
}
})
.state('tabs.facts', {
url: "/facts",
views: {
'home-tab': {
templateUrl: "templates/facts.html"
}
}
})
.state('tabs.facts2', {
url: "/facts2",
views: {
'home-tab': {
templateUrl: "templates/facts2.html"
}
}
})
.state('tabs.about', {
url: "/about",
views: {
'about-tab': {
templateUrl: "templates/about.html"
}
}
})
.state('tabs.navstack', {
url: "/navstack",
views: {
'about-tab': {
templateUrl: "templates/nav-stack.html"
}
}
})
.state('tabs.contact', {
url: "/contact",
views: {
'contact-tab': {
templateUrl: "templates/contact.html"
}
}
});
链接到一个:
<ion-tab title="About" icon="ion-ios-information" href="#/tab/about">
<ion-nav-view name="about-tab"></ion-nav-view>
</ion-tab>
如果我将tabs.home更改为home,我可以使用#/home吗?是的,但是您在使用tab时会遇到问题。如果你只需要视图和链接,你可以做一个简单的路由:或者你可以做。state('tabs',{url:,abstract:true,…我不知道它是否真的有效。清除tabs状态(url:)中的url似乎有效。试试看。如果你愿意,我可以将它添加到答案中。