0

我确定这是一个非常愚蠢的问题，但我是 angularjs 的新手，并试图找到解决方案，但似乎没有任何效果。可能是我对路由器的解释错误。

我的控制器只有在我将 ng-controller 添加到 html 文件时才会加载，如果我不这样做，但我认为路由器会处理这个问题。我正在使用 requirejs 并在此示例中缩小了我的脚本。

索引.html

<!doctype html>
<html ng-app>
<head>
    <!-- load our application -->
    <script src="assets/vendor/requirejs/require.js" data-main="assets/js/config"></script>
</head>

<body id="splash">
hehe my page
</body>
</html>

配置.js

requirejs.config({
  baseUrl: 'assets/js',
  paths: {
    angular: '..\\vendor\\angularjs\\angular',
    bootstrap: '..\\vendor\\bootstrap',
    jquery: '..\\vendor\\jquery\\jquery'
  },
  shim: {
    bootstrap: [
        'jquery'
    ],
    angular: {
        deps: ['jquery'],
        exports: 'angular'
    }
  }
});

require(['app/app']);

应用程序.js

define(['angular'], function (angular) {
    angular.module('fettnerd.controllers', []);
    angular.module('fettnerd', ['fettnerd.controllers']);

    require(['app/routing'], function() {
        angular.bootstrap(document, ['fettnerd']);
    });
});

路由器.js

define(['angular', 'app/controllers/IndexCtrl'], function(angular) {
angular.module('fettnerd')
    .config(function($routeProvider, $locationProvider) {
        $locationProvider.html5Mode(true);  // we want history api

        $routeProvider.when("/home", {
                controller: "IndexCtrl"
            });
        $routeProvider.otherwise({redirectTo: '/home'});
    });
});

IndexCtrl.js

define(['angular', 'jquery'], function(angular, $) {
    angular.module('fettnerd.controllers')
        .controller('IndexCtrl', function($scope) {
            console.log('test');
            $scope.login = function(e) {
                alert('Soon. How soon? Very soon.');
            }
        });
});
4

1 回答 1

2

您的 index.html 中缺少ng-view。

ngView 是一个指令，它通过将当前路由的渲染模板包含到主布局 (index.html) 文件中来补充 $route 服务。每次当前路由变化时，包含的视图都会根据 $route 服务的配置而变化。

<body id="splash" ng-view>
</body>
于 2013-06-18T20:54:53.667 回答