Unable to display images from PERSISTENT storage I

Question

i am trying to display images from PERSISTENTstorage in my ionic app and using $cordovaFile plugin.

My Code:

controller('surveyLoad', function($q, $cordovaFile, $rootScope, $scope, $ionicLoading, localStorageService, $state, surveyApi, AppConfig, ionicDatePicker){

var QuestionIndex = 0;

window.answerData = '';

if($state.params.surveyId == 1){

    var SurveyData = localStorageService.get('SurveyData');
    console.log(localStorageService.get('SurveyData'));

}else if($state.params.surveyId == 2){

    var SurveyData = localStorageService.get('SurveyData2');
    console.log(localStorageService.get('SurveyData2'));
}

var totalQuest = Object.keys(SurveyData).length

$scope.totalQst = totalQuest+1;  //Set Total Question Value in Survey.html

if($state.params.QuestId.trim() != ''){

    QuestionIndex = $state.params.QuestId;
}

$scope.currentQst = parseInt(QuestionIndex)+1; //Set Current Question number in Survey.html

//if Survey According to Question Order
if(AppConfig.QuestionOrder == 'true'){

    angular.forEach(SurveyData, function(value, key) {
        if(value.question_order == QuestionIndex){

            var paramQid = key;
            var QuestionID = value.question_id;
        }
    });
}
//end here
var QuestType  =  SurveyData[QuestionIndex].question_type;
//var QuestImage =  '<img src="img/gaph.png" alt="" class="qimg">';
var DrawHTML = {
                  'QuestionText': SurveyData[QuestionIndex].question_text, 
                  'QuestionDesc': SurveyData[QuestionIndex].question_desc,
                  'QuestAnswers': SurveyData[QuestionIndex].answers,
                  'scope'       : $scope,
                  'raw'         : SurveyData[QuestionIndex]
               };

switch(QuestType){

    case'text':
        text(DrawHTML, ionicDatePicker, $q, $rootScope, $cordovaFile);
    break;

    case'textarea':
        textarea(DrawHTML);
    break;

    case'number':
        number(DrawHTML);
    break;

    case'email':
        email(DrawHTML);
    break;

    case'radio':
        radio(DrawHTML);
    break;

    case'checkbox':
        checkbox(DrawHTML);
    break;

    case'select':
        select(DrawHTML);
    break;
}

});

function text(params, ionicDatePicker, $q, $rootScope, $cordovaFile){
     $scope.QuesHtml = "<p>"+params.QuestionText+"</p>";
     $scope.DescHtml = "<p>"+params.QuestionDesc+"</p>";

     var fname = "SmaartMedia/jellyfish.jpg";
       $cordovaFile.checkFile(cordova.file.externalRootDirectory, fname)
          .then(function(obj) {
           $scope.image_1 = obj.nativeURL;
          $scope.$apply();
      }, function(error) {
          alert(error.code);
      });
}

survey.html

<p>Sample for media and captcha <img ng-src={{image_1}} />  <img ng-src={{image_2}} /></p>

i don't know why i am getting error on cordova.file.externalRootDirectory. In console its showing (even on mobile)

Cannot read property 'externalRootDirectory' of undefined

can anyone please tell me where's the problem in my code?

Thanks