Angularjs Ui sref不生成可点击链接/不工作
我以前使用过ng route,它工作得很好,但使用UI Router,链接不再可点击,或者至少在大多数情况下不可点击。当它们是随机的时,它们不会显示我正在使用的html模板 HTML: 我在遵循AngularJS上SitePoint电子书中的说明,所以我不确定我做错了什么或错过了什么Angularjs Ui sref不生成可点击链接/不工作,angularjs,angular-ui-router,Angularjs,Angular Ui Router,我以前使用过ng route,它工作得很好,但使用UI Router,链接不再可点击,或者至少在大多数情况下不可点击。当它们是随机的时,它们不会显示我正在使用的html模板 HTML: 我在遵循AngularJS上SitePoint电子书中的说明,所以我不确定我做错了什么或错过了什么 我在标记中的任何地方都看不到ui视图,因此您的州视图很可能没有被呈现和注入 您不需要ng视图。主HTML文件中应该存在一个ui视图。您的顶级状态将被渲染并注入其中。状态可以有子状态,并且具有子状态的状态的每个模板都
我在标记中的任何地方都看不到
ui视图,因此您的州视图很可能没有被呈现和注入
您不需要ng视图
。主HTML文件中应该存在一个ui视图
。您的顶级状态将被渲染并注入其中。状态可以有子状态,并且具有子状态的状态的每个模板都应该有自己的ui视图
,其中将注入其渲染的子状态
仔细查看使其工作的基础知识。此外,他们还有一个很好的例子,它的来源确实帮助我理解了这个状态路由引擎的功能以及如何使用它。有用的信息,希望
虽然上面的答案是正确的(缺少ui视图
,引用ui.router
,等等),但我遇到过视图加载的其他问题将导致无法生成链接的情况。例如,今天早上我忘记引用模块angular cache
,遇到了CacheFactory
未加载的问题(与ui.router
完全无关)。在解决引用之前,ui.router
已经死在水里了。我在标记的任何地方都没有看到ui视图
,因此,你所在州的观点很可能没有被呈现出来injected@JAAulde我应该使用它而不是ng视图还是与之结合使用?主HTML文件中应该存在一个ui视图。您的顶级状态将被渲染并注入其中。您不需要ng视图
。状态可以有子状态,并且具有子状态的状态的每个模板都应该有一个ui视图
,其中将注入其呈现的子状态。太好了,谢谢!现在工作正常。查看ui路由器的自述文件,了解使其工作的基本知识:。此外,他们有一个很好的演示应用程序,你可以下载并浏览,这真的帮助我了解了这个状态路由引擎是关于什么以及如何使用它。这对我很有帮助。我遇到了一个不相关的错误(null检查),它阻止了ui sref的默认行为。谢谢
<head>
<title>Tutorial</title>
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-ui-router.min.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
</head>
<body>
<ng-view></ng-view>
<ul class="menu">
<li><a ui-sref="view1">view1</a></li>
<li><a ui-sref="view2">view2</a></li>
</ul>
angular.module('myApp', [
'myApp.controllers',
'ui.router'
]);
angular.module('myApp').config(function($stateProvider, $urlRouterProvider) {
$stateProvider.state('view1',{
url: '/view1',
controller:'Controller1',
templateUrl:'/view1.html'
}).state('view2', {
url: '/view2/:firstname/:lastname',
controller: 'Controller2',
resolve: {
names: function() {
return ['Misko', 'Vojta', 'Brad'];
}
},
templateUrl: '/view2.html'
});
$urlRouterProvider.otherwise('/view1');
});
angular.module('myApp.controllers', []).controller('Controller1', function($scope, $location, $state) {
$scope.loadView2=function() {
$state.go('view2', {
firstname: $scope.firstname,
lastname: $scope.lastname
});
};
}).controller('Controller2', function($scope, $stateParams, names) {
$scope.firstname = $stateParams.firstname;
$scope.lastname = $stateParams.lastname;
$scope.names = names;
});