gpt4 book ai didi

javascript - 如何使用 Angular UI-Router 获取状态?

转载 作者:行者123 更新时间:2023-11-28 14:59:00 24 4
gpt4 key购买 nike

我正在尝试使用以下代码将我的 Angular 路由从 routeProvider 迁移到 stateProvider,单击导航栏时我没有看到状态内容,知道出了什么问题吗?

app.js

angular.module('sampleApp', ['ui.router', 'MainCtrl', 'NerdCtrl', 'NerdService'])
.config(function($stateProvider, $urlRouterProvider) {

$urlRouterProvider.otherwise('/home');

$stateProvider
.state('home', {
url: '/home',
templateUrl: 'views/home.html',
controller: 'MainController'
})
.state('nerd', {
url: '/nerd',
templateUrl: 'views/nerd.html',
controller: 'NerdController'
});
});

main.html

<body ng-app="sampleApp" ng-controller="NerdController">
<div class="container-fluid">
<!-- HEADER -->
<nav class="navbar navbar-inverse">
<div class="navbar-header">
<a class="navbar-brand" ui-href="home">Stencil: Node and Angular</a>
</div>
<!-- LINK TO OUR PAGES. ANGULAR HANDLES THE ROUTING HERE -->
<ul class="nav navbar-nav">
<li><a ui-sref="nerd">Nerds</a></li>
</ul>
</nav>
<!-- ANGULAR DYNAMIC CONTENT -->
<div ng-view></div>
</div>
<script src="libs/angular/angular.min.js"></script>
<script src="libs/angular-ui-router/release/angular-ui-router.min.js"></script>
<!-- ANGULAR CUSTOM -->
<script src="js/controllers/MainCtrl.js"></script>
<script src="js/controllers/NerdCtrl.js"></script>
<script src="js/services/NerdService.js"></script>
<script src="js/appRoutes.js"></script>
<script src="js/app.js"></script>
</body>

最佳答案

使用ui-view而不是ng-view,在该元素中ui-router将基于$location放置模板 更改。

<div ui-view></div>

关于javascript - 如何使用 Angular UI-Router 获取状态?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41755717/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com