Quantcast
Channel: Ionic Framework - Ionic Forum
Viewing all articles
Browse latest Browse all 49167

Help with ng-repeat and view not refreshing after http.get please

$
0
0

@LukeUSMC wrote:

I have read so many tutorials, tried countless permutations and still cannot figure out what I am doing wrong. The view loads but never gets refreshed after the promise is returned from my factory. Have tried to create a fiddle/plunker but still learning and don't know how to cut this down to a simpler version.

HTML (tried ng-repeat and ionic-collection

<ion-content id="device-list-content" class="fade-in">
      Device List

      <md-card>
    <ion-content>
      <div class="card-content">
        <div class="device-content-detail"
          collection-repeat="device in p.devices"
          collection-item-height="136px"
          collection-item-width="100%">
          <div class="card-content">
              <h1 class="md-title">
                      <span>
                          <i class="fa fa-crosshairs" aria-hidden="true"></i>
                        Device List
                      </span>
              </h1>
          {{device.name}}
        </div>
      </div>
    </ion-content>
  </md-card>
</ion-content>


        <md-list>
        <md-card ng-if="!isAnimated" class="card-item" ng-repeat="device in p.devices track by $index">
                <md-card-content>
                    <div class="card-content">
                        <h1 class="md-title">
                                <span>
                                  Device List
                                    <i class="fa fa-crosshairs" aria-hidden="true"></i>{{device.name}}
                                </span>
                        </h1>
                        <div class="device-content-detail">
                            <i class="fa fa-wifi" aria-hidden="true"></i>{{device.connected}}
                            <i class="fa fa-heartbeat" aria-hidden="true"></i>{{device.last_heard}}
                        </div>
                    </div>
                </md-card-content>
        </md-card>

Controller

appControllers.controller('devicesCtrl', function ($scope,$state,$stateParams,$timeout,$mdDialog,$ionicHistory,$ionicLoading,particle,pDevices,safeparse) {
    //$scope.isAnimated is the variable that use for receive object data from state params.
    //For enable/disable row animation.
    var debug = true;
    $ionicLoading.show({
      content: 'Getting Devices',
      animation: 'fade-in',
      showBackdrop: true,
      maxWidth: 200,
      showDelay: 0
    });

    $timeout(function () {
  pDevices.getpDevices().then(function(data) {
    $scope.p.devices = data;
    if (debug) console.log(debug + 'time out got particle.io device list: ', $scope.p.devices);
    $scope.isLoading = false;
    if (debug) console.log(debug + 'time out complete, hiding ionicLoading: ');
    $ionicLoading.hide();
  }, function() {
    $scope.p.showAlertDialog($event);
    $scope.error = 'unable to load devices'
    });
  }, 2000);

$scope.initialForm = function () {
    //$scope.isLoading is the variable that use for check statue of process.
    $scope.isLoading = true;
    $scope.isAnimated =  $stateParams.isAnimated;
};// End initialForm.
$scope.$watch('p');
$scope.p = {
  currentDevice: '',
  deviceId: particle.setDevice(),
  token: particle.setToken(),
  devices: [],

  getDevices: function () {
        pDevices.getpDevices().then(function(deviceList) {
          if (debug) console.log(debug + 'getDevices got particle.io device list: ', deviceList);
          $scope.p.devices = deviceList.data;
        });
      },

  // Select the current device for particle platform
  setDevice: function (deviceId) {
    if (deviceId) {
      if (debug) console.log(debug + 'setDevice', deviceId);
      $scope.p.deviceId = deviceId;
      particle.setDevice(deviceId);
      $scope.startup();
    }
    return $scope.p.deviceId;
  }
};

showAlertDialog = function ($event) {
    $mdDialog.show({
        controller: 'DialogController',
        templateUrl: 'confirm-dialog.html',
        targetEvent: $event,
        locals: {
            displayOption: {
                title: "No Devices Found.",
                content: "Unable to load Device List.",
                ok: "Confirm"
            }
        }
    }).then(function () {
        $scope.dialogResult = "You choose Confirm!"
    });
}// End showAlertDialog.
$scope.initialForm();
});// End of controller Device.

Factory

appServices.factory('pDevices', function($http, localstorage) {
  root_url = 'https://api.particle.io/v1/'
  var getpDevices = function() {
    return $http.get(root_url + 'devices').then(function(response){
      console.log('pDevices getpDevices: ', response.data);
      return response.data;
      });
    };
  return {
  getpDevices: getpDevices
  };
});

Gets me this:

Posts: 1

Participants: 1

Read full topic


Viewing all articles
Browse latest Browse all 49167

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>