angular-ui-router 错误 - 错误：when() 中的“处理程序”无效

Question

我正在使用 angular 1.5 和 angular-ui-router 版本 0.2.18

我的 app.js 文件如下所示：

import angular from 'angular';
import uiRouter from 'angular-ui-router';
import 'angular-ui-bootstrap';
import './components/logIn/logIn';
import './components/home/home';

    angular.module('app', ['ui.bootstrap', 'app.components', uiRouter])
      .controller('mainCtrl', function() {
      })
      .config(['$stateProvider', '$urlRouterProvider', '$urlMatcherFactoryProvider', function($stateProvider,   $urlRouterProvider,   $urlMatcherFactoryProvider){
        $urlRouterProvider
          .when('/home', {
            template: '<home></home>'
          })
          .otherwise({
            redirectTo: '/home'
          });
      }]);

我收到以下错误：

未捕获的错误：[$injector:modulerr] 无法实例化模块应用程序 由于：错误：when() 中的“处理程序”无效 在 $UrlRouterProvider.when (eval at (http://localhost:8080/app.bundle.js:511:2), :1916:13) 在评估（评估在（http://localhost:8080/app.bundle.js:493:2），:20:22） 在 Object.invoke （评估在 (http://localhost:8080/app.bundle.js:505:2), :4604:19） 在 runInvokeQueue（评估在 (http://localhost:8080/app.bundle.js:505:2), :4497:35） 在评估（评估在（http://localhost:8080/app.bundle.js:505:2），：4506:11） 在 forEach （评估在 (http://localhost:8080/app.bundle.js:505:2), :321:20） 在 loadModules (eval at (http://localhost:8080/app.bundle.js:505:2), :4487:5) 在 createInjector （评估在 (http://localhost:8080/app.bundle.js:505:2), :4409:19） 在 doBootstrap（评估在 (http://localhost:8080/app.bundle.js:505:2), :1691:20）

我认为是template 属性。不能这样设置模板吗？

Answer 1

我认为您将urlRouterProvider 与routeProvider 混淆了。

后者用于定义路由（以及它们的模板）。 当 URL 不匹配时（作为字符串或函数），您使用第一个重定向。您使用的otherwise 也属于$routeProvider。

所以只要切换就可以了：

$routeProvider.when('/home', {
    template: '<home></home>'
});

// or $urlRouterProvider.otherwise('/home');
$routeProvider.otherwise({ redirectTo: '/home' });