How to fix loading GPS location in Huawei and Samsung devices

Question

I have a form I did with Angularjs that collects user data including GPS location through a button. (The app is hybrid app)

I tried changing some stuffs in the code and could not work. Also Google could not give any solutions.

Here is the code:

<div class="content-field">
    <div class="gps-field" ng-class="$ctrl.field.value? 'has-data' : ''" ng-click="getPosition()" type="button">
        <i class="icon-ami-gps-loc" ng-style="{color: $ctrl.fieldstyle.link_color}"></i>
        <label>{{ 'gpsInformation' | translate }}</label>
    </div>
    <i class="icon-ami-erase-fields-q clear-field" ng-click="clearData()"></i>
    <div class="gps-data" ng-class="$ctrl.field.value? 'active' : ''">{{ (($ctrl.field && $ctrl.field.value)? 'gpsPositionString': 'gpsPlaceholder') | translate:$ctrl.field.value }}</div>
</div>

And here is the class:

class GeolocationField {
  constructor (GeolocationService, LoaderFactory, ErrFactory, $translate, $scope, $rootScope) {
    Object.defineProperties(this,{
      'GeolocationService': { value: GeolocationService },
      'LoaderFactory': { value: LoaderFactory },
      'ErrFactory': { value: ErrFactory },
      '$rootScope': { value: $rootScope }
    });
    $scope.getPosition = this.getPosition.bind(this);
    $scope.clearData = this.clearData.bind(this);
  }

  getPosition () {
    if (this.$rootScope.readOnly) return;

    this.LoaderFactory.show();
    this.LoaderFactory.initShowCancelButtonText();

    Promise.race([
      this.GeolocationService.getCurrentPosition(),
      ( new Promise((res,rej) => this.LoaderFactory.once('updated:Interruption',() => {
        if (this.LoaderFactory.getInterruption()) rej(new this.ErrFactory.QuietError())
      })) )
    ])
    .then((position) => {
      this.field.value = position;
    })
    .catch((err) => {
      if (err instanceof this.ErrFactory.DeniedPermissionForGeolocation.IOS) {
        return err.confirm()
        .then((ans) => {
          if (ans != 2) return;
          else return cordova.plugins.settings.open();
        })
      }
      else if (err instanceof this.ErrFactory) return err.notify();
      else console.error(err);
    })
    .then(() => { this.LoaderFactory.hide() });
  };
  clearData () {
    if (this.$rootScope.readOnly) return;

    this.field.value = '';
  };
}

GeolocationField.reqest_str = 'gpsPlaceholder';
GeolocationField.anwer_str = 'gpsPositionString';

app.component('gpsField', {
    templateUrl: './scripts/components/geolocation-field/template.html',
    controller: GeolocationField,
    bindings : {
        item: '<',
        field: '<',
        fieldstyle: '<'
    },
});

As required, on Chrome, IOS devices and a few android devices(RedMI, Tecno...) works all fine in like 5secs longest.

The issue is on Huawei P Smart and Samsung S9 and Samsung Tab 6 it keeps showing the loader forever past 5 mins.

Could there be some specification I am missing about these devices? Also note I have implemented this functionality natively...no plugins used.