2016-06-21 45 views
0

我想在AngularJS寫一個應用程序更新模型,並在某些時候我通過表單更新我的數據:如何讀取數據之後,從JSON在AngularJS

<h3> Anzeige </h3> 

<form name="anzeige-form" ng-controller="AnzeigeController as anzCtrl" ng-submit="anzCtrl.getMyOrder()"> 
    <label for="id">Meine Bestellnummer</label><input type="text" required class="form-control" id="id" ng-model="anzCtrl.id" placeholder="0..X" /> 
    <button type="submit" class="btn btn-default">Laden/Aktualisieren</button> 


<div class="ausgabe"> 
Ihre Adresse : {{anzCtrl.myorder.order.address}} 
<ul class="list-unstyled anzeige"> 
    <li class="list-item" ng-repeat="pizza in anzCtrl.myorder.order.cart"> 
     <h3>{{pizza.name}}</h3><br/> 
     <span class="status" ng-if="pizza.status=0">Bestellt</span> 
     <span class="status" ng-if="pizza.status=1">Im Ofen</span> 
     <span class="status" ng-if="pizza.status=2">Lieferbereit</span> 
     <span class="status" ng-if="pizza.status=3">Unterwegs</span> 
     <span class="status" ng-if="pizza.status=4">Lieferbereit</span> 
     <div class="progress"> 
      <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="{{pizza.status}}" aria-valuemin="0" aria-valuemax="4" style="width: {{pizza.status * 25}}%"> 
       <span class="sr-only">{{pizza.status * 25}}% Abgeschlossen</span> 
      </div> 
     </div> 
    </li> 
</ul> 
</div> 
</form> 

的角度代碼如下所示:

.controller('AnzeigeController',function($http){ 

    //$scope.adress = ''; 
    this.id = 21; 
    //this.myorder = order2; 
    this.myorder = {}; 
    //$scope.myarray = {}; 

    this.getMyOrder = function(){ 

     $http.get('get_by_id.php',{params:{"id": this.id}}).success(function(datar){ 

      this.myorder = angular.fromJson(datar); 
      console.log(this.myorder); 
     }) 
    } 
}) 

我現在的問題是,我不知道該怎麼告訴角度,一個異步更新已發生,我的列表將用正確的值更新。記錄myorder變量在調試器/控制檯中爲我提供了一個正確的對象。

我大多不明白如何訪問數據,因爲Line {{anzCtrl.myorder.order.address}}不顯示任何內容。

我有一個主要的思維錯誤是我的猜測。 請澄清如何正確地做到這一點。

最好的問候,馬克

+0

沒有必要告訴角度發生異步更新。使用$ http.get時,角會自動更新它。錯誤必須在其他地方。嘗試使用jquery和$(選擇器).scope() – CodeToad

回答

0

的問題是,this不再是指控制器模型時,你的諾言解決。您需要創建另一個變量來保存this,然後在您的承諾解決時使用這個其他變量。

.controller('AnzeigeController', function($http) { 
    var _this = this; 
    _this.id = 21; 
    _this.myorder = {}; 

    _this.getMyOrder = function() { 
     $http.get('get_by_id.php',{params:{"id": _this.id}}).success(function(datar){ 
      _this.myorder = angular.fromJson(datar); 
      console.log(_this.myorder); 
     }) 
    } 
}) 
+0

調試DOM上的作用域非常好,現在它的工作原理!必須繼續處理其餘的代碼。 :) – Marc

+0

很高興它的作品。請考慮將此標記爲問題的答案,以便它不會在沒有答案的問題列表中繼續顯示。 – Lex