[英]ui-router and Angularjs issue
https://thinkster.io/mean-stack-tutorial/问题几乎来自于本教程。 如有必要,请参见“角度布线”部分。 这是我的index.html-
<html>
<head>
<title>My Angular App!</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="/Users/Taylor/WebstormProjects/thinkstertut/node_modules/bootstrap/dist/css/bootstrap-theme.min.css">
</head>
<body ng-app="flapperNews">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<ui-view></ui-view>
</div>
</div>
</body>
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="app.js"></script>
</html>
那是我的index.html的HTML代码。 我也有我的home.html文件,但是无论我在index.html中使用脚本标签还是将其分隔到它自己的文件(home.html)中,在显示视图时都遇到了问题。 这是我的.js-
var app = angular.module('flapperNews', ['ui.router']);
app.config([
'$stateProvider',
'$urlRouterProvider',
function($stateProvider, $urlRouterProvider){
$stateProvider
.state('home', {
url: '/home',
templateUrl: '/home.html',
controller: 'MainCtrl'
});
$urlRouterProvider.otherwise('/home');
}]);
app.factory('posts', [function(){
var o = {
posts: []
};
return o;
}]);
app.controller('MainCtrl', ['$scope', 'posts',
function($scope, posts) {
$scope.posts = posts.posts;
$scope.test = 'hello world';
$scope.posts = [
{title: 'post 1', upvotes: 4},
{title: 'post 2', upvotes: 25},
{title: 'post 3', upvotes: 14},
{title: 'post 4', upvotes: 8},
{title: 'post 5', upvotes: 5}
];
$scope.addPost = function (){
if( !$scope.title || $scope.title === '') {
alert('must have title silly!');
return;
}
$scope.posts.push({
title: $scope.title,
link: $scope.link,
upvotes: 0 });
$scope.title = '';
$scope.link = '';
};
$scope.incrementUpvotes = function(post) {
post.upvotes += 1;
};
}
]);
不知道是否...。ui-router不能正常工作,或者可能仅仅是控制器未链接-有时我确实有角度代码显示而没有实际运行,但现在我只是运行index.html时显示空白页面-感谢您提供任何帮助,只是不确定要让ui-router爱我缺少什么。 我通读了文档,但是...我想还没有点击。 谢谢!
这是您的代码。 您有2个问题,首先是您将脚本标签插入体外,这会导致解析错误,我认为,主要问题是您首先加载了angular-ui-router
库,首先加载了angularjs
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.