Angular1：TypeError：promise.catch 不是函数答案

【问题标题】：Angular1: TypeError: promise.catch is not a functionAngular1：TypeError：promise.catch 不是函数
【发布时间】：2017-11-12 22:14:17
【问题描述】：

使用 angular-ui-router，单击 index.html 中的链接 view1 和 view2 时出现以下错误。同样的例子适用于普通的角度路由器，我在代码中遗漏了什么吗？谢谢。

TypeError: promise.catch is not a function
    at silenceUncaughtInPromise (angular-ui-router.js:1079)
    at silentRejection (angular-ui-router.js:1082)
    at angular-ui-router.js:1771
    at handleError (angular-ui-router.js:1614)
    at TransitionHook.invokeHook (angular-ui-router.js:1631)
    at Function.TransitionHook.invokeHooks (angular-ui-router.js:1729)
    at Transition.run (angular-ui-router.js:3475)
    at StateService.transitionTo (angular-ui-router.js:7015)
    at StateService.go (angular-ui-router.js:6911)
    at angular-ui-router.js:8862

app.js -

angular.module('app1',[
'ui.router',
'app.controller']).
config(function($stateProvider,$urlRouterProvider,$locationProvider) {
        $stateProvider.state('view1',{
            url: '/view1',
            controller: 'Controller1',
            templateUrl: '/partials/view1.html'
        }).state('view2',{
            url: '/view2/:firstname/:lastname',
            controller: 'Controller2',
            templateUrl: '/partials/view2.html',
            resolve: {
                names: function(){
                    return ['JavaScript','JQuery','Angular','Bootstrap'];
                }
            }
        });
        $urlRouterProvider.otherwise('/index');
        $locationProvider.html5Mode(true);
});

controller.js -

angular.module('app.controller',[]).
    controller('Controller1',function($scope,$location,$state){
        $scope.loadView2 = function(){      
                $state.go('view2', {
                        firstname: $scope.firstname,
                        lastname: $scope.lastname
                });
            //$location.path('/view2/'+$scope.firstname+'/'+$scope.lastname);
        }
    }).controller('Controller2',function($scope,$stateParams,names){
        $scope.firstname = $stateParams.firstname;
        $scope.lastname = $stateParams.lastname;
        $scope.names = names;
    });

index.html -

<!DOCTYPE html>
<html>
<head>
    <script src="/jquery/jquery.js"></script>
    <script src="/angular/angular.js"></script>
    <script src="/angular/angular-route-1.2.3.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.3/angular-ui-router.js"></script>
    <script src="/bootstrap/js/bootstrap.js"></script>
    <script src="/js/app.js"></script>
    <script src="/js/controllers.js"></script>
    <link rel="stylesheet" type="text/css" href="/bootstrap/css/bootstrap.css"/>
    <title>
        Angular App
    </title>
</head>
<body ng-app="app1">
    <div>
    <ul class="menu">
<li><a ui-sref="view1">view1</a></li>
<li><a ui-sref="view2">view2</a></li>
</ul>
        <ng-view></ng-view>
    </div>
</body>
</html>

【问题讨论】：

retrun ['JavaScript','JQuery','Angular','Bootstrap']; 附近的拼写错误 -> return ['JavaScript','JQuery','Angular','Bootstrap'];
@lin 谢谢，已更正，但仍然出现同样的错误。
请创建一个 plnkr/fiddle 来重现它。

标签： html css angularjs angular-ui-router

【解决方案1】：

更改 1
您正在使用 Angular UI-Router。

在您的index.html 中，将<ng-view></ng-view> 替换为<div ui-view></div>

如果您一直使用ngRoute，ng-view 将是有效的。但是，由于在您的项目中，您使用的是ui.router，您应该使用<div ui-view></div>

更改 2
由于您使用的是html5Mode，因此您需要在index.html 中设置base href。
在index.html 的<head> 中添加<base href="/"> 标签

【讨论】：

谢谢，通过添加
代码现在可以工作了，但是在 view1 和 view2 之间切换时控制台上仍然出现相同的错误，对此有什么想法吗？
我已经更新了我的答案以表明需要进行另一项更改（基本 href）。除此之外，当我将代码复制到我的机器上时，它运行良好。