ui-router和Angularjs問題

Question

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愛我缺少什么。 我通讀了文檔，但是...我想還沒有點擊。 謝謝！

Answer 1

這是您的代碼。 您有2個問題，首先是您將腳本標簽插入體外，這會導致解析錯誤，我認為，主要問題是您首先加載了angular-ui-router庫，首先加載了angularjs

ui-router和Angularjs問題

問題描述

1 個解決方案

解決方案1
1 已采納 2015-04-13 19:49:14

ui-router和Angularjs問題

問題描述

1 個解決方案

解決方案1 1 已采納 2015-04-13 19:49:14

解決方案1
1 已采納 2015-04-13 19:49:14