angular, try to display object in ng-repeat fails

Posted by Simone M on Stack Overflow See other posts from Stack Overflow or by Simone M
Published on 2014-08-19T09:10:21Z Indexed on 2014/08/19 10:20 UTC
Read the original article Hit count: 315

Filed under:
|
|

i'm writing an mobile application in javascript with angularJS and ionicframework (last beta v.11), i create dinamically an object and want to display all objects inside in a ng-repeat. Why nr-repeat don't display anything? This is screen from my object:

enter image description here

I use this code for put values in scope:

$scope.distanceSuppliers = myCar;

And this is the code in html:

<ion-item ng-repeat="(id, supplier) in distanceSuppliers">
            <div class="items item-button-right" ng-click="openDetails(id)">
                {{supplier.name}}<br />
                {{supplier.address}}<br />
            </div>
        </ion-item>

This is my complete code for JS:

.controller('suppliers', function($scope, cw_db, $ionicPopup, $ionicActionSheet, appdelegate, $rootScope, $firebase, $location, $ionicLoading, cw_position) {

    $ionicLoading.show({
        template: 'Updating data..'
    });

    var geocoder;
    var tot = 0;
    var done = 0;
    geocoder = new google.maps.Geocoder();

    cw_db.getData(cw_db.getSuppliers(), "", function(suppliers) {

        cw_position.getPosition(function (error, position) {
            suppliers.on('value', function(supp) {
                $scope.distanceSuppliers = {};
                tot = 0;
                done = 0;
                supp.forEach(function(childSnapshot) {
                    tot++;
                    var childData = childSnapshot.val();
                    if (childData.address) {
                        calculateDistance(childData, position.coords.latitude, position.coords.longitude);
                    }
                });
            });
            $ionicLoading.hide();
        });
    });


    function calculateDistance(childData, usrLat, usrLon) {
        var service = new google.maps.DistanceMatrixService();
        service.getDistanceMatrix(
            {
              origins: [new google.maps.LatLng(usrLat, usrLon)],
              destinations: [childData.address],
              travelMode: google.maps.TravelMode.DRIVING,
              unitSystem: google.maps.UnitSystem.METRIC,
              avoidHighways: false,
              avoidTolls: false
            }, function(response, status) {
                if (status != google.maps.DistanceMatrixStatus.OK) {
                    alert('Error was: ' + status);
                } else {
                    done++;
                    var results = response.rows[0].elements;
                    childData.distance = results[0].distance.value;
                    $scope.distanceSuppliers.push(childData);
                    if (done == tot) {

                        console.log($scope.distanceSuppliers);
                    }
                }
            });
    }


    $scope.openDetails = function(index) {
        //appdelegate.setCallId(index);
        //$location.path("/app/supplierDetails");
    }

})

what's wrong?

© Stack Overflow or respective owner

Related posts about angularjs

Related posts about object