我在angular裡面使用了ui-router, 在a標籤中使用了ui-sref,但是現在發現一個情況就是,有時候莫名其妙瀏覽器地址欄裡的參數會和標籤裡寫的不一致,而且時好時壞,不知道問題出在哪裡了。
點擊a標籤,會跳到另一個視圖上去的。不知道這樣寫對,主要是這個現象會突然出現,毫無規律可循,網址列的變化都是靠ui-sref去改變的,也沒有用別的東西去修改url。 。
路由代碼
.state('chschool',{
url: '/chschool',
views: {
'': {
templateUrl: 'templates/chschool.html' //总视图 内嵌了顶部和右侧学校部分
},
'indexheader@chschool':{
templateUrl: 'templates/indexheader.html' //顶部
},
'itemcontent':{
templateUrl: 'templates/schoolpart.html' //学校部分
}
}
})
.state('chschool.school',{ //修改学校 用来局部刷新 学校部分 这里根据路由参数
url: '/school/{id}',
views: {
'itemcontent':{
templateUrl: 'templates/schoolpart.html'
}
}
})
.state('chdorm',{ //进入楼栋的页面 需要根据传入的学校参数来获取对应的楼栋,这里就碰到了传入的学校id会和schoolpart.html里面用ng-repeat循环出来的ui-sref中的参数不同
url: '/chdorm/{id}',
views: {
'': {
templateUrl: 'templates/chdorm.html'
}
}
})
html 部分 總視圖
<section ui-view="indexheader"></section>
<p ng-show="hidep" class="yo-container">
<p class="yo-xs-left">
<p class="yo-area" >
<p ng-include="'templates/citypart.html'"></p> //城市
</p>
</p>
<p class="yo-xs-right">
<p class="yo-school">
<!--<p ng-include="'templates/schoolpart.html'"></p>-->
<p ui-view="itemcontent"></p> //学校部分
</p>
</p>
</p>
citypart.html
<a ng-repeat="item in items" ui-sref=".school({id:item.ID})" ui-sref-active="yo-active">
{{item.cityname}}
</a>
schoolpart.html
<p class="yo-school-name" ng-controller="chschoolController">
<p class="yo-team-join" ng-if="items.length==0">团队招募,期待你的加入</p>
<p class="yo-school-list" ng-repeat="item in items track by $index" ng-cloak>
<a ui-sref="chdorm({id:item.ID})" ng-click="setItem($index)">{{item.schName}}</a>
</p>
</p>
最好把壞的情況是什麼樣式貼出來,
題外話,你js可以稍微優化
能放上出現錯誤的截圖嗎?
如果需要定位的話,可以在config裡面監聽路由切換事件$stateChangeStart,並查看路由變換記錄: