无法从ng-repeat中获取数据

时间:2017-04-19 04:35:30

标签: javascript angularjs angularjs-ng-repeat

当我使用ng-repeat显示来自php的数据json时它可以工作但是当我用于按钮的数据时它不能抓取一些数据。我的数据从http my controller.js

获取经纬度和经度
     .controller('HomeCtrl', function ($scope, kaka, $ionicPopup,  $http){
$scope.item ={};
              $scope.code = {};
              $scope.sizes = [ {code: 123456789, name: 'Modul 1'}, {code: 864369038796946, name: 'Modul 4'},
                                {code: 864369038803833, name: 'Modul 5'}, {code: 864369038816645, name: 'Modul 6'},
                                {code: 864369038797142, name: 'Modul 7'}, {code: 864369038796698, name: 'Modul 8'}];
                $scope.update = function(selected) {
                   $scope.item = selected;
                };
            $scope.rlockbtn = function () {
                kaka.rlock($scope.item.code).success(function (data) {
                    var alertPopup = $ionicPopup.alert({
                            title: $scope.item.code,
                            template: 'Lock'
                        });                    
                }).error(function (data) {

                });
            };
         $http.get("http://192.168.100.13:88/OMG1/web.php?tN=find")
                      .then(function(response) {
                          $scope.myWelcome = response.data;
                      });
        $scope.find = function () {
                            var mylatlng = {lat: $scope.myWelcome.latitude, lng: $scope.myWelcome.longitude};
                            var map = new google.maps.Map(document.getElementById('map'), {
                                zoom: 15,
                                center: {lat: -7.3342266, lng: 112.7650341},
                                //center: {lat: data[0].lat, lng: data[0].lng},
                                mapTypeId: 'terrain'
                            });
                            var marker = new google.maps.Marker({
                                position: mylatlng,
                                map: map,
                                title: 'Your Motor'
                            });
                    };

        )}

这是我的HTML代码

<script src="angular.min.js"></script>
<ion-view view-title="Home">
  <ion-content style="background-color:#818181; background-size: cover;">
    <ion-item  class="row item-text-wrap " >
        <div class="col" style="height: 300px;padding: 0px" id="map" data-tap-disabled="true"></div>
    </ion-item><br>
    <form name="form">
    <div class="button-bar">
        <div>

            <select ng-options="size as size.code for size in sizes " ng-model="item" style="background-color:#4d94ff;color: white"ng-change="update(item)"></select>
        </div>           
    </div>
        <div>
            <ul>
                {{myWelcome}}
                <li ng-repeat="x in myWelcome" >
                  {{ x.latitude}}
                  {{ x.longitude}}
                </li>
            </ul>
            <button class="btn btn-success btn-lg" style="background-color:#4d94ff;color: white" ng-click="rlockbtn()" >Lock</button>
            <button class="btn btn-success btn-lg" style="background-color:#4d94ff;color: white" ng-click="unlock()" >Unlock</button>
            <button class="btn btn-success btn-lg" style="background-color:#4d94ff;color: white" ng-click="engine()" >Engine Off</button>
        </div>
    </form>
    <div class="button-bar">

        <button class="icon ion-ios-location btn btn-success btn-lg" style="background-color:#4d94ff;color: white" ng-click="find()" > Find</button>
        <button class="icon ion-map btn btn-success btn-lg" style="background-color:#4d94ff;color: white" ng-click="tracking()" > Tracking</button>
    </div>
  </ion-content>
</ion-view>

请帮我解决我的问题

1 个答案:

答案 0 :(得分:0)

我不确定,但看起来你的myWelcome.latitude和经度是数组,所以它应该是:

<ul>
            {{myWelcome}}
            <li ng-repeat="x in myWelcome.latitude" >
              {{ x}}
            </li>
            <li ng-repeat="x in myWelcome.longitude" >
              {{ x}}
            </li>
        </ul>