2016-02-17 3 views
0

Я делаю свой первый угловой проект (ионный каркас), где я должен получить некоторые данные из базы данных и в случае успеха я Havet к

  1. хранить его в переменном

  2. перейдите на страницу, где используется эта переменная.

Страница осуществляется навигацией, но данные не отправляются.

Вот мой search.html код:

<body ng-app="starter" ng-controller="ListCtrl"> 
<ion-pane> 
    <ion-header-bar class="bar-stable"> 
     <h1 class="title">Real Estate</h1> 
    </ion-header-bar> 
    <ion-content> 
     <h4 align="center"> Enter Place or Pincode </h4> 
     <div class="list list-inset" > 
      <label class="item item-input"> 
       <input type="text" name="place" ng-model="data.place" value="" placeholder="Place" ng-focus="$scope.placefocus=true;data.pincode=null" ng-blur="$scope.placefocus=false" ng-disabled = "$scope.pincodefocus"> 
      </label> 
      <label class="item item-input"> 
       <input type="number" name="pincode" ng-model="data.pincode" value="" placeholder="Pin Code" ng-focus="$scope.pincodefocus=true;data.place=null" ng-blur="$scope.pincodefocus=false" ng-disabled="$scope.placefocus"> 
      </label> 
     </div> 
     <button class="button button-block button-positive" ng-click="getdata()"> 
      Search 
     </button> 
    </ion-content> 
</ion-pane> 
</body> 

А вот мой контроллер код:

app.controller('ListCtrl',function($scope,$http,$location,$window){ 
$scope.data = {}; 
$scope.getdata = function(){ 
    //alert($scope.data.place); 
    $http.get("http://localhost/angular/data.php") 
                 //,{'place':$scope.data.place,'pincode':$scope.data.pincode}) 
     .success(function(response,status,headers,config){ 
      alert(response); 
      $scope.datas=response; 
      $scope.navig('/show.html'); 
     }) 
} 
$scope.navig = function(url){ 
    $window.location.href=url; 
}; 
}); 

и вот мой show.html страница:

<ion-content> 
<div class="list card" ng-repeat="site in datas"> 
<div class="item item-body"> 
    <a href="#" class="subdued"><img class="full-image" src="img/{{site.image}}" height="150px"> 
     <p> 
      RS.{{site.price}} &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <span> {{site.square_feet}} sq.ft &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</span><span>{{site.bed}} BHK</span> 
     </p> 
    </a> 
</div> 
</div> 
</ion-content> 

alert(response) в коде контроллера оповещает [object Object],[object Object],[object Object] Но страница вывода (show.html) является пустым

Если я позвоню navig("/show.html") непосредственно с кнопкой мыши (в search.html) вместо getdata() и измените код контроллера на нижний, я получаю результат: (Но я не могу выполнить этот путь, потому что мне нужно получить данные из базы данных для определенного места и введенного кода)

app.controller('ListCtrl',function($scope,$http,$location,$window){ 
    $scope.data = {}; 
    $http.get("http://localhost/angular/data.php") 
                //,{'place':$scope.data.place,'pincode':$scope.data.pincode}) 
     .success(function(response,status,headers,config){ 
      alert(response); 
      $scope.datas=response; 
     }) 
    $scope.navig = function(url){ 
     $window.location.href=url; 
    }; 
}); 
+1

Было бы здорово, если бы вы поделились скрипкой, на которой мы можем редактировать. В любом случае попробуйте использовать $ scope. $ Apply() после установки ответа. Это может помочь –

+0

Как использовать $ scope. $ Apply() Пожалуйста, дайте ссылку. – Abdulla

ответ

0

$ scope работает только с контроллером! Вместо $ scope используйте $ rootScope.

1

Не используйте функцию успеха, используйте функцию .then(). Код приведен ниже из угловой документации.

$http({ 
    method: 'GET', 
    url: '/someUrl' 
}).then(function successCallback(response) { 
    // this callback will be called asynchronously 
    // when the response is available 
    }, function errorCallback(response) { 
    // called asynchronously if an error occurs 
    // or server returns response with an error status. 
    }); 

Вот текст из Documentation

Deprecation Notice

The $http legacy promise methods success and error have been deprecated. Use the standard then method instead. If $httpProvider.useLegacyPromiseExtensions is set to false then these methods will throw $http/legacy error.

+0

Если я использую. Then вместо .success, я получаю «TypeError: $ http.get (...). Then (...). Ошибка не является функцией« в консоли Google Chrome ». – Abdulla

0

Это может быть обещание. Почему бы вам не попробовать это.

app.controller('ListCtrl',function($scope,$http,$location,$window){ 
     $scope.data = {}; 
     $http.get("http://localhost/angular/data.php") 
                 //,{'place':$scope.data.place,'pincode':$scope.data.pincode}) 
      .then(function(response){ 
       alert(response); 
       $scope.datas=response; 
      }) 
     $scope.navig = function(url){ 
      $window.location.href=url; 
     }; 
    }); 
Смежные вопросы