Angular应用程序没有被引导?

时间:2015-10-30 08:19:03

标签: javascript html angularjs

我正在试图找出为什么我的角应用程序无效。

所以我有以下代码:

app.modules.js

angular.module("quickscan", [
        "ui.router",

        "quickscan.controllers"
]);

angular.module("quickscan.controllers", []);

app.routes.js

var app = angular.module("quickscan");

app.config(function ($stateProvider, $urlRouterProvider, $controllerProvider, $compileProvider, $filterProvider, $provide, $httpProvider) {
    $urlRouterProvider.otherwise("/test");

    $stateProvider
        .state("app", {
            abstract: true,
            templateUrl: "shared/Layout/Main.html"
        })
        .state("app.root", {
            url: "/test",
            templateUrl: "shared/Main/Main.html"
        })
        .state("buildings", {
            url: "/buildings",
            controller: "BuildingDetailController",
            templateUrl: "components/BuildingDetail/BuildingDetailView.html"
        });
});

的index.html

<!DOCTYPE html>
<html>
<head>
    <title>Quickscan App v2</title>
    <meta http-equiv="X-UA-Compatible" content="IE=9" />
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=no">
    <link rel="stylesheet" href="content/css/app.css">
</head>
<body>

    <div ng-view id="view"></div>

    <!-- order dependend scripts -->
    <script src="scripts/jquery/jquery.js"></script>
    <script src="scripts/angular/angular.js"></script>
    <script src="app/app.module.js"></script>

    <!--remaining scripts-->
    <script src="content/js/scripts.js"></script>

    <!--angular scripts-->
    <script src="content/js/all.js"></script>

    <script>
        setTimeout(function() {
            angular.bootstrap(document, ['quickscan']);
            console.log("Hello");
        }, 3000);

    </script>

</body>
</html>

all.js

(function () {

    var app = angular.module("quickscan");

    app.config(function ($stateProvider, $urlRouterProvider, $controllerProvider, $compileProvider, $filterProvider, $provide, $httpProvider) {
        $urlRouterProvider.otherwise("/test");

        $stateProvider
            .state("app", {
                abstract: true,
                templateUrl: "shared/Layout/Main.html"
            })
            .state("app.root", {
                url: "/test",
                templateUrl: "shared/Main/Main.html"
            })
            .state("buildings", {
                url: "/buildings",
                controller: "BuildingDetailController",
                templateUrl: "components/BuildingDetail/BuildingDetailView.html"
            });
    });

})(); 
var Building = function (data) {
 // some other class
    return building;
};

var Category = function (data, parent, building) {
        // some class 
    return category;
};

(function () {
    "use strict";

    angular
        .module("quickscan.controllers")
        .controller("BuildingDetailController",
        function ($scope, $rootScope) {
            var vm = this;
            vm.title = "Building Detail";

            function activate() {
                console.log("test");
            }

            activate();

        });
})();
(function () {
    "use strict";

    angular
        .module("quickscan.controllers")
        .controller("CategoryDetailController",
        function ($scope, $rootScope) {
            var vm = this;
            vm.title = "Building Detail";

            function activate() {
                console.log("test");
            }

            activate();

        });
})();

但该应用没有加载我的任何观看次数,我的控制器没有报告test并且它没有被重定向到/#,也没有出现任何错误,任何人都有线索?

1 个答案:

答案 0 :(得分:2)

看起来您没有使用ui-view指令,请参阅https://github.com/angular-ui/ui-router/wiki/The-Components

你的

<div ng-view id="view"></div>

应该是

<div ui-view></div>