使用ui-router在angularjs中路由问题 [英] Routing issue in angularjs with ui-router
问题描述
我们正面临angularJs SPA的问题，问题似乎是在使用ui-router时路由到同一页面的#fragments。我们配置了如下所示的路线和菜单项，
Hi ,
We are facing issue with angularJs SPA, the problem seems to be with routing to the #fragments in same page when using ui-router. We configured the routes and menu items like below,
<a ui-sref="home" ng-click="CloseDrawer()"><span>Home</span></a>
<a ui-sref="services" ng-click="CloseDrawer()"><span>Services</span></a>
<a ui-sref="map" ng-click="CloseDrawer()"><span>Map</span></a>
app.config(function ($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('home');
$stateProvider
.state('home',
{
url: '#home',
templateUrl: 'Templates/home.html'
}).state('services',
{
url: '#services',
templateUrl: 'Templates/home.html'
}).state('pricing',
{
url: '#map',
templateUrl: 'Templates/home.html',
controller: 'mapController'
});
});
点击锚标签，基于路由器重定向的路线。
我的index.html /主页SPA的内容如下所示
upon click on anchor tag, based on routes router is redirecting.
My index.html / main page for SPA looks some thing like below
<body id="_body" ng-controller="RootCtrl" ng-class="DrawerClass">
<div id="main" class="container_m">
<!--Drawer-->
<my_drawer></my-drawer>
<div class="content-wrap" ng-click="CloseDrawer()">
<div class="content">
<!--Header is custom directive-->
<my-header></my-header>
<!--Main part where views will be rendered-->
<ui-view></ui-view>
</div>
<!--Footer is custom directive-->
<my-footer></my-footer>
</div>
</div>
和home.html如下所示
and home.html looks like below
<section id='home'>
.
.
</section>
<section id='services'>
.
.
</section>
<section id='map'>
.
<!--map goes here-->
.
<map></map>
.
</section>
问题是，当我们点击菜单中的任何链接时，与地图路线相关联的控制器将触发其初始化（）和网址形成'/＃/ home #map'。请注意url中的2个哈希片段。
我们正在从BodyController的initController init（）初始化地图，当我们点击地图菜单项目地图时消失。
在SPA中使用ui-router时，我们无法弄清楚#fragment重定向（在Same页面中，使用diff Divs）以及导致MAP消失的原因这个案子？
感谢Adv，
Harry
我尝试过：
尝试从路由配置中移除控制器并放置在地图div上但没有用。在一些博客讨论建议的路线中放置哈希，以避免在ui-sref =＃/ services中进行额外的重定向但没有用。
The problem is, when ever we click on any link from menu, the controller associated with the map route is firing its init() and the url is forming like '/#/home#map'. please notice 2 hash fragments in url.
and we are initializing the map from RootController init() which is on body tag and as we click on map menu item map disappearing.
We are unable to figure out,the #fragment redirection (in Same page, with diff Divs) when using ui-router in SPA and what causing MAP to disappear in this case?
Thanks in Adv,
Harry
What I have tried:
Tried removing controller from route config and placed on map div but no use. placed hash in route as some of blog discussions suggested, to avoid extra redirection in ui-sref="#/services" but no use.
推荐答案
stateProvider ，
stateProvider,
urlRouterProvider ）{
urlRouterProvider) {
urlRouterProvider .otherwise（' home'）;
urlRouterProvider.otherwise('home');
这篇关于使用ui-router在angularjs中路由问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
