1
從任何原點導航到「editarTitulo」狀態時,顯示一個白色屏幕,沒有錯誤信息。我在很多地方使用了這個解決方案,但沒有任何效果。 我的代碼:白色屏幕並且沒有錯誤信息
模塊:
(function() {
angular.module('gerenciadorEpisodios', ['ui.router', 'ui.bootstrap']);
})();
路由器:
(function() {
'use strict';
angular
.module('gerenciadorEpisodios')
.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function($stateProvider, $urlRouterProvider, $locationProvider) {
$urlRouterProvider.otherwise('/home');
$stateProvider.state('home', {
url: '/home',
views: {
nav: {
templateUrl: 'view/navbar.html'
},
content: {
templateUrl: 'view/home.html',
controller: 'HomeController',
controllerAs: 'vm'
}
}
});
$stateProvider.state('meusTitulos', {
url: '/meus_titulos',
views: {
nav: {
templateUrl: 'view/navbar.html'
},
content: {
templateUrl: 'view/meus_titulos.html',
controller: 'MeusTitulosController',
controllerAs: 'vm'
}
},
resolve: {
titulosPrepService : titulosPrepService
}
});
$stateProvider.state('novoTitulo', {
url: '/novo_titulo',
views: {
nav: {
templateUrl: 'view/navbar.html'
},
content: {
templateUrl: 'view/novo_titulo.html',
controller : 'NovoTituloController',
controllerAs: 'vm'
}
}
});
$stateProvider.state('editarTitulo', {
url: '/editar_titulo/:id',
view: {
nav : {
templateUrl: 'view/navbar.html'
},
content: {
templateUrl: 'view/editar_titulo.html',
controller : 'EditarTituloController',
controllerAs : 'vm',
}
}
});
$stateProvider.state('about', {
url: '/about',
views : {
nav: {
templateUrl: 'view/navbar.html'
},
content: {
template: '<h4>Created by: Leonardo Cardena</h4>'}
}
});
titulosPrepService.$inject = ['tituloService'];
/* @ngInject */
function titulosPrepService (tituloService) {
return tituloService.getTitulos();
}
}])
})();
MeusTitulosController:
(function() {
'use strict';
angular
.module('gerenciadorEpisodios')
.controller('MeusTitulosController', MeusTitulosController);
MeusTitulosController.$inject = ['titulosPrepService', 'tituloService'];
/* @ngInject */
function MeusTitulosController(titulosPrepService, tituloService) {
var vm = this;
vm.titulos = titulosPrepService;
}
})();
EditarTituloController:
(function() {
'use strict';
angular
.module('gerenciadorEpisodios')
.controller('EditarTituloController', EditarTituloController);
EditarTituloController.$inject = ['$stateParams'];
/* @ngInject */
function EditarTituloController($stateParams){
var vm = this;
vm.titulo.id = $stateParams.id;
}
})();
meus_titulos.html
<div class="container">
<h2 class="meus-titulos">Meus Títulos</h2>
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th>Título</th>
<th>Episódio Atual</th>
<th>Episódios Totais</th>
<th>Temporada Atual</th>
<th></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="titulo in vm.titulos | orderBy: 'nome' track by titulo.id">
<td>{{titulo.nome}}</td>
<td>{{titulo.episodioAtual}}</td>
<td>{{titulo.episodiosTotais}}</td>
<td>{{titulo.temporada}}</td>
<td>
<a ui-sref="editarTitulo({id : titulo.id})">
Editar
</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
editar_titulo.html
<div>
test
</div
的index.html
<!DOCTYPE html>
<html ng-app="gerenciadorEpisodios">
<head>
<meta charset="UTF-8">
<title>Gerenciador de Episódios</title>
<link rel="stylesheet" type="text/css" href="lib/bootstrap/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/app.css">
</head>
<body>
<div ui-view="nav"></div>
<main ui-view="content" role="main"></main>
<!--libs imports-->
<script src="lib/angularjs/angular.js"></script>
<script src="lib/angularjs/angular-messages.js"></script>
<script src="lib/angularjs/angular-ui-router.js"></script>
<script src="lib/angularjs/ui-bootstrap.js"></script>
<!--module import-->
<script src="js/gerenciador-episodios.module.js"></script>
<!--routes import-->
<script src="js/config/gerenciador-episodios.routes.js"></script>
<!--values import-->
<script src="js/value/url-base.value.js"></script>
<!--services import-->
<script src="js/service/titulo.service.js"></script>
<!--controllers import-->
<script src="js/controller/home.controller.js"></script>
<script src="js/controller/meus-titulos.controller.js"></script>
<script src="js/controller/novo-titulo.controller.js"></script>
<script src="js/controller/editar-titulo.controller.js"></script>
</body>
</html>
這是真的。此外,問題可能出現在'$ state'解析器中,因爲'ui.router' [往往會失敗](https://github.com/angular-ui/ui-router/issues?utf8=%E2%9C% 93 q =無聲) –