为什么在使用 ui-router 时会得到 div 的重复?
Why do I get a duplication of div while using ui-router?
我写了一个简单的演示来尝试理解ui路由器。
但问题是,我在使用 ui 路由器时得到了重复的视图。
这是 stateProvider 部分
app.config(function($stateProvider,$urlRouterProvider){
$urlRouterProvider.otherwise('/baseView');
$stateProvider
.state('baseView',{
url:"/baseView",
templateUrl:"baseView.html"
})
.state('baseView.empty',{
abstract: true,
views:{
"navBar":{
templateUrl:"sideBar.html",
controller: "sideCtrl"
},
"123":{
templateUrl:"content.html"
}
}
})
.state('baseView.empty.content1',{
url:'/content1',
templateUrl:"content1.html"
})
.state('baseView.empty.content2',{
url:'/content2',
templateUrl:"content2.html"
})
})
笨蛋:http://plnkr.co/edit/Rm0Q50GX2GYvqyKnzkKz?p=preview
在plunker中看到预览就会发现问题。
我认为问题出在状态提供者部分,因为如果我完全删除状态提供者,就不会出现重复...
问题与状态定义无关。原因是你加载了 angular.js
& ui-router.js
两次,这两次实例化了相同的东西。您可以删除其中一个引用,使其正常工作。
我写了一个简单的演示来尝试理解ui路由器。
但问题是,我在使用 ui 路由器时得到了重复的视图。
这是 stateProvider 部分
app.config(function($stateProvider,$urlRouterProvider){
$urlRouterProvider.otherwise('/baseView');
$stateProvider
.state('baseView',{
url:"/baseView",
templateUrl:"baseView.html"
})
.state('baseView.empty',{
abstract: true,
views:{
"navBar":{
templateUrl:"sideBar.html",
controller: "sideCtrl"
},
"123":{
templateUrl:"content.html"
}
}
})
.state('baseView.empty.content1',{
url:'/content1',
templateUrl:"content1.html"
})
.state('baseView.empty.content2',{
url:'/content2',
templateUrl:"content2.html"
})
})
笨蛋:http://plnkr.co/edit/Rm0Q50GX2GYvqyKnzkKz?p=preview
在plunker中看到预览就会发现问题。
我认为问题出在状态提供者部分,因为如果我完全删除状态提供者,就不会出现重复...
问题与状态定义无关。原因是你加载了 angular.js
& ui-router.js
两次,这两次实例化了相同的东西。您可以删除其中一个引用,使其正常工作。