在 IE 上运行时，“Promise”是未定义的错误答案

【问题标题】：'Promise' is undefined error when run on IE在 IE 上运行时，“Promise”是未定义的错误
【发布时间】：2016-10-30 09:28:19
【问题描述】：

我的控制器代码在 Chrome 上运行良好，但在 IE 10 上运行时返回相同的代码

ReferenceError: 'Promise' is undefined

返回错误的函数是：

new Promise(function(resolve) {
    MetaModel.load($scope, (regionExist ? reqParmRegion[1] : reqParmRegion), (screenExist ? reqParmScreen[1] : reqParmScreen), resolve);
}).then(function(){

    loadRelationshipByStep($scope.preStep);
     if($rootScope.regionId === 'us') {
        $rootScope.currRel = 'itself';
    } 

    if($rootScope.screenId.indexOf('search') !== -1 ){
       EnumerationService.loadEnumerationByTab();
    }  
    // load data for tab click
    if($rootScope.currRel !== 'undefined' && $rootScope.currRel !== 'itself' && $scope.regionId !== 'us'){
        $scope.loadDataByTab($rootScope.currRel);
    } else if($rootScope.resourceHref !== undefined) {
        var params = {};
         resourceFactory.get($rootScope.resourceHref, params, $rootScope.headers).success(function(responseData){
            var data = responseData.data || responseData;
            if (data) {
                $scope.data=data;
                EnumerationService.executeEnumerationFromBackEnd(data, 'create');
                if($rootScope.regionId === 'us'){
                    EnumerationService.executeEnumerationFromBackEnd(data, 'fetch');    
                }
            }
        });            
    }
});

我需要添加任何 $promise 变量吗？

【问题讨论】：

标签： angularjs angular-controller

【解决方案1】：

IE 不支持原生原生javascriptPromise。见browser compatibility on MDN。

Angular 包含提供承诺功能的$q 服务。您可以使用$q.defer() 创建一个延迟对象并从该对象返回承诺。

我认为等效的代码是：

// create the deferred object
var deferred = $q.defer();

// pass the resolve method as the callback
MetaModel.load($scope, (regionExist ? reqParmRegion[1] : reqParmRegion), 
    (screenExist ? reqParmScreen[1] : reqParmScreen), deferred.resolve);

// chain actions onto the promise.
deferred.promise.then(function(){

    loadRelationshipByStep($scope.preStep);
     if($rootScope.regionId === 'us') {
        $rootScope.currRel = 'itself';
    } 

    if($rootScope.screenId.indexOf('search') !== -1 ){
       EnumerationService.loadEnumerationByTab();
    }  
    // load data for tab click
    if($rootScope.currRel !== 'undefined' && $rootScope.currRel !== 'itself' && $scope.regionId !== 'us'){
        $scope.loadDataByTab($rootScope.currRel);
    } else if($rootScope.resourceHref !== undefined) {
        var params = {};
         resourceFactory.get($rootScope.resourceHref, params, $rootScope.headers).success(function(responseData){
            var data = responseData.data || responseData;
            if (data) {
                $scope.data=data;
                EnumerationService.executeEnumerationFromBackEnd(data, 'create');
                if($rootScope.regionId === 'us'){
                    EnumerationService.executeEnumerationFromBackEnd(data, 'fetch');    
                }
            }
        });            
    }
});

【讨论】：

虽然我使用你的解决方案暂时解决了这个问题，但所有 ES6 问题的永久解决方案似乎是使用 ES6-Shim。我使用了这里提到的 Shim：github.com/paulmillr/es6-shim
@RahulVarma，我不知道您是否正在使用 Protractor 进行测试，但如果您是，我不知道它如何与本机 (ES6-Shim) 承诺集成。当使用$q Protractor 时，会意识到未解决的承诺，并将等待它们完成。如果您使用 Protractor，那么了解这两个选项之间的任何差异会很有趣。

【解决方案2】：

https://github.com/stefanpenner/es6-promiseCorrect我，如果我错了，但在我看来，您使用的是 Promise 的本机实现，IE 尚不支持。

在这种情况下，请尝试使用polyfill。

另外，您可以使用Angular's $q service，它是基于kriskowal's Q module 的Promise Pattern 实现。

例子：

$q(function (resolve, reject) {
    MetaModel.load($scope, (regionExist ? reqParmRegion[1] : reqParmRegion), (screenExist ? reqParmScreen[1] : reqParmScreen), resolve);
}).then(function () {

    loadRelationshipByStep($scope.preStep);
     if($rootScope.regionId === 'us') {
        $rootScope.currRel = 'itself';
    } 

    if($rootScope.screenId.indexOf('search') !== -1 ){
       EnumerationService.loadEnumerationByTab();
    }  
    // load data for tab click
    if($rootScope.currRel !== 'undefined' && $rootScope.currRel !== 'itself' && $scope.regionId !== 'us'){
        $scope.loadDataByTab($rootScope.currRel);
    } else if($rootScope.resourceHref !== undefined) {
        var params = {};
         resourceFactory.get($rootScope.resourceHref, params, $rootScope.headers).success(function(responseData){
            var data = responseData.data || responseData;
            if (data) {
                $scope.data=data;
                EnumerationService.executeEnumerationFromBackEnd(data, 'create');
                if($rootScope.regionId === 'us'){
                    EnumerationService.executeEnumerationFromBackEnd(data, 'fetch');    
                }
            }
        });            
    }
});

【讨论】：

【解决方案3】：

Native promise 是旧版浏览器不支持的 ES6 功能。您需要添加一个 polyfill 以支持旧浏览器，例如 https://github.com/taylorhakes/promise-polyfill。

由于您使用的是 AngularJS，因此您可以使用 $q 服务来创建跨浏览器工作的 Promise。

【讨论】：