我正在努力实现一个全屏加载页面,该页面将在首次加载应用程序时显示。 基本上,我正在尝试完成这样简单的事情(初始加载页面(: http://fuse-angular-material.withinpixels.com/
为此,我想到了使用 UI-Router 的想法(这样我就可以在繁忙的请求中重复使用(。所以我尝试了以下内容,但无论我如何责备,似乎都有效。
应用配置:
Main_App.config( function($stateProvider, $urlRouterProvider) {
var Loading = {
abstract: true,
name: 'Loading',
url: '/',
templateUrl: "Pages/Loading.html"
}
var Home = {
name: 'Home',
url: '/Home',
templateUrl: "Pages/Home.html"
}
$stateProvider.state(Loading);
$stateProvider.state(Home);
$urlRouterProvider.otherwise("/");
})
.HTML:
<body ng-app="Main_App">
<ui-view name="Loading" ></ui-view> //Get a blank page
<div ui-view="Loading"></div> //Get a blank page
<div>
<div>
<div>
<ui-view></ui-view> //loading page shows up here if i remove abstract.
</div>
</div>
</div>
</body>
有人知道我错过了什么吗?
我不认为你按照它想要的方式使用抽象。
https://ui-router.github.io/ng1/docs/latest/interfaces/state.statedeclaration.html#abstract
在我看来,对于您的用例,加载不必是抽象状态。 它可以是一个正常状态,它将发出必要的 API 请求来获取数据以正确引导您的应用程序,并且完成此操作会将状态转换为/home,这是您的应用程序的实际起点。
希望这为您指明了正确的方向。 干杯!