我开始使用ui-router,但ui-view中没有显示任何内容。将所有内容简化为最小化,我将其添加到planker中仍然无效。我的项目:https://plnkr.co/edit/ERyqonTWZyEhzXd77z0M?p=preview
的index.html:
<!DOCTYPE html>
<html>
<head>
<script data-require="angular.js@1.4.8" data-semver="1.4.8" src="https://code.angularjs.org/1.4.8/angular.js"></script>
<script data-require="ui-router@*" data-semver="0.2.15" src="https://cdn.rawgit.com/angular-ui/ui-router/805e69bae319e922e4d3265b7ef565058aaff850/release/angular-ui-router.js"></script>
<script src="mainModule.js"></script>
<script src="mainController.js"></script>
</head>
<body ng-app="mainModule">
<h1>This is our views:</h1>
<div ui-view></div>
</body>
</html>
mainModule.js:
angular.module("mainModule",["ui.router"])
.config(function ($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise("/");
$stateProvider.
state("adminLogin",{
url:"/",
templateURL:"view1.html",
controller:"coolController"
}).
state("adminPanel",{
url:"/adminPanel",
templateURL:"view2.html",
controller:"coolController"
})
});
mainController.js:
angular.module("mainModule")
.controller("coolController",['$scope','$state',function($scope, $state) {
$scope.adminData = {
login: undefined,
password: undefined
}
}])
view1.html:
<div>YOU DID IT!!</div>
view2.html:
<h1>It's admin Page!</h1>
我希望有人可以帮我解决问题,因为我花了很多时间试图解决问题,但没有任何帮助=(
答案 0 :(得分:1)
外部模板的参数为templateUrl
而不是templateURL
答案 1 :(得分:0)
templateUrl
代替templateURL
您的state
定义中有拼写错误。使用templateUrl
代替templateURL
angular.module("mainModule",["ui.router"])
.config(function ($stateProvider, $urlRouterProvider) {
$stateProvider.
state("adminLogin",{
url:"/",
templateUrl:"view1.html",
controller:"coolController"
}).
state("adminPanel",{
url:"/adminPanel",
templateUrl:"view2.html",
controller:"coolController"
})
$urlRouterProvider.otherwise('/');
});