CODEWITHSUNDEEP
angularjsangular-controller
Rahul Kalidindi
Rahul Kalidindi

Reputation: 4736

'Promise' is undefined error when run on IE

I have a controller code that runs fine on Chrome, but when run on IE 10 the same code returns 

ReferenceError: 'Promise' is undefined

The function that returns the error is:

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');    
                }
            }
        });            
    }
});

Do i need to add any $promise variables?

Upvotes: 3

Views: 11643

Answers (3)

Danilo Valente
Danilo Valente

Reputation: 11342

https://github.com/stefanpenner/es6-promiseCorrect me if I'm wrong, but it seems to me that you're using the native implementation of Promise, which is not supported by IE (yet).

In this case, try using a polyfill.

Also, you may use Angular's $q service, which is a Promisse Pattern implementation based on kriskowal's Q module.

Example:

$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');    
                }
            }
        });            
    }
});

Upvotes: 0

T J
T J

Reputation: 43156

Native promise is an ES6 feature which is not supported by old browsers. You need to add a polyfill to support old browsers, for example https://github.com/taylorhakes/promise-polyfill.

Since you're using AngularJS you can use the $q service instead to create promises which work cross browsser.

Upvotes: 0

detaylor
detaylor

Reputation: 7280

IE does not support native the native javascript Promise. See browser compatibility on MDN.

Angular includes the $q service that provides promise functionality. You can create a deferred object using $q.defer() and return the promise from that object.

I think that the equivalent code would be:

// 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');    
                }
            }
        });            
    }
});

Upvotes: 5

Related Questions