AngularJS:ngRoute,否则无效

时间:2014-06-15 10:14:41

标签: angularjs ngroute

我有一个非常奇怪的错误,我设置了我的路线和我的控制器。现在我只有一个没有错误的空白页面?

的index.html;

<!DOCTYPE html>
<html ng-app="RekenTalent" lang="nl">
    <head>
        <title>Rekentalent.nl: Ben jij een talent in Rekenen?</title>
        <!-- Stylesheets -->
        <link rel="stylesheet" type="text/css" href="/app/front/assets/stylesheets/style.css">
        <!-- AngularJS -->
        <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular.min.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular-route.min.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular-animate.min.js"></script>
        <!-- Controllers -->
        <script src="/app/front/controllers/controller.js"></script>
        <!-- Router -->
        <script src="/app/front/router.js"></script>
    </head>

    <body ng-view></body>
</html

&GT;

Controller.js:

/**
*  RekenTalent
*
* Copyright 2014 - Rekentalent.nl
*/
var RekenTalent = angular.module('RekenTalentControllers', []);

RekenTalent.controller('rekenCtrl', ['$scope', function($scope){

}]);

Router.js:

var RekenTalent = angular.module('RekenTalent', [
    'ngRoute', 'RekenTalentControllers'
]);

RekenTalent.config(['$routeProvider', function($routeProvider) {
    $routeProvider.
    when('/index', {
        templateUrl: '/templates/index.html',
        controller: 'rekenCtrl'
    }).
    otherwise({
        redirect: '/index'
    });
}]);

而/templates/index.html只是说'嗨'。有谁知道为什么我得到一个空白页面?它应该将我重定向到/index.html,而/index.html应该使用/templates/index.html作为模板。问题和解决方案是什么?

更新:

当我去/索引它起作用,所以否则param不起作用,为什么不呢?

3 个答案:

答案 0 :(得分:17)

redirect更改为redirectTo

最好使用home.template来避免所有这类问题,我的意思是考虑:

你有index.html包含整个包含的脚本,例如angular,jquery,...,而body标签中有ng-view,好吗?

现在,如果您有任何模板,例如welcome或其他索引,请在home.html中写出该模板,好吗?像这样:

index.html:

<body ng-app="yourapp">
   <div ng-view>
   </div>
</body>

Home.html中

  <div>
     Welcome, user. This is index.
  </div>  

您的应用配置:

yourapp.config(function($routeProvider) {
   $routeProvider
      .when('/', {
         templateUrl: 'partials/home.html',
         controller: 'homeCtrl'
      })
      .otherwise({redirectTo:'/'});
}

最好将所有模板放在partials文件夹中,其中father文件夹包含index.html,如下所示

  root 
     yourAppFolder
       1-Assets
          Css
          Js

       2-Partials
          home.html
          login.html

       3-index.html

答案 1 :(得分:2)

找到它;重定向应该是redirectTo;

var RekenTalent = angular.module('RekenTalent', [
    'ngRoute', 'RekenTalentControllers'
]);

RekenTalent.config(['$routeProvider', function($routeProvider) {
    $routeProvider.
    when('/index', {
        templateUrl: '/app/front/templates/index.html',
        controller: 'rekenCtrl'
    }).
    otherwise({
        redirectTo: '/index'
    });
}]);

答案 2 :(得分:1)

我有这个代码示例:

.config(['$routeProvider', 
function($routeProvider) {
    console.log('routeando');
    //alert('otherwise' + $routeProvider.route);
    $routeProvider.
        when('/', {     templateUrl: 'home'}).
        when('/route1', {  templateUrl: 'route1'}).

        /*Without the next line, redirectTo doesnt work*/
        when('/error', {  templateUrl: 'error'}).
        otherwise({     redirectTo: '/error'});
}]);    

如果您已经为该路线提供了“when”参数,则只会起作用。

对不起我的英语,祝你有愉快的一天。