[英]ui-router - ui view and link not working
我正在尝试ui路由器的角度。 我将以下代码行添加到我的app.js中的应用程序模块中:
angular
.module("ngClassifieds", ['ngMaterial', 'ui.router'])
.config(function($mdThemingProvider, $stateProvider){
$mdThemingProvider.theme('default')
.primaryPalette('teal')
.accentPalette('orange');
$stateProvider
.state('stateone', {
url:'/stateone',
template: '<h1>State one</h1>'
})
.state('statetwo', {
url: '/statetwo',
template: '<h1>State two</h1>'
});
});
在我的html上,我只是放置一个空的ui视图以测试我是否正在获取这两个标头,但没有运气:
<ui-view></ui-view>
通过输入以下内容在我的localhost链接上进行测试:
localhost:8080/#/stateone
localhost:8080/#/statetwo
但是由于某些原因,它不会在任何链接中加载/显示任何标题,而只是显示没有标题的页面。
我已经将angular-ui-router.js包含在我的index.html中
如果有人能指出我做错了,那太好了。
如果有人想知道:这是我的脚本的顺序:
<script src="node_modules/angular/angular.js"></script>
<script src="node_modules/angular-animate/angular-animate.js"></script>
<script src="node_modules/angular-aria/angular-aria.js"></script>
<script src="node_modules/angular-material/angular-material.js"></script>
<script src="node_modules/angular-ui-router/release/angular-ui-router.js"></script>
<script src="scripts/app.js"></script>
<script src="components/classifieds.ctr.js"></script>
<script src="components/classifieds.fac.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
由于您没有收到任何错误,因此很难理解出了什么问题,但是您可以看看我的plunkr并找出来。 我删除了棱角材料。
https://plnkr.co/edit/WGjzY6flSx5Ces1moSPk?p=preview
<script>
angular
.module("ngClassifieds", ['ui.router'])
.config(function( $stateProvider){
$stateProvider
.state('stateone', {
url:'/stateone',
template: '<h1>State one</h1>'
})
.state('statetwo', {
url: '/statetwo',
template: '<h1>State two</h1>'
});
});
</script>
</head>
<body>
<h1>Hello Plunker!</h1>
<a href="#/stateone">Link1</a>
<a href="#/statetwo">Link2</a>
<ui-view></ui-view>
</body>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.