2016-06-10 14 views
1

Ich muss eine Liste der Produkte anzeigen und in der Lage sein, auf sie zu klicken, um mehr Informationen über sie zu erhalten.Angular JS ng-repeat Element wird nicht aktualisiert

Meine Liste der Produkte ist benannt in einem Dienst gespeichert: „productsServices“

ich eine HTML-Seite bekam, die meine Produkte alle und eine andere Anzeige, die Details für ein Produkt anzuzeigen. Jede HTML-Seite hat ihren eigenen Controller.

Wenn ich ein Produkt auf meiner Detailseite aktualisiere, wird die Änderung in meinen productsServices vorgenommen, aber in meiner globalen Produktansicht nicht bestätigt. So

(function() 
 
{ 
 
    angular.module('app').service('productsServices', ['$http', '$q', ProductsServices]) 
 
    that = this 
 
    
 
    that.products   = /*arrayOfData*/; 
 
    that.getProducts  = function() { 
 
           return that.products; 
 
           } 
 
})(); 
 

 

 
(function() 
 
{ 
 
    angular.module('app').controller('ProductsController', ['$http', '$q', 'productsServices', ProductsController]) 
 
    
 
    that     = this 
 
    that.products   = productsServices.getProducts; 
 
    
 
    that.showDetail  = function (item) { 
 
           $state.go('menu.product', { myParam: item }); 
 
          } 
 
})();
<!--Global HTML page--> 
 
<ion-content id="content" class="has-header has-subheader" delegate-handle="myScroll"> 
 
     <ion-list> 
 
      <ion-item ng-repeat="product in that.products() track by product.ProductId" href="#" ng-click="that.showDetail({{product}})"> 
 
       <div class="innerProd"> 
 
        <img id="productPicture" name="productPicture" ng-src='data:image/png;base64,{{product.ThumbnailPhoto}}'></div> 
 
       <div class= "innerProd"> 
 
        <p>{{product.Name}}</p> 
 
        <p>{{product.Price}}$</p> 
 
        <ion-option-button class="button button-assertive" 
 
             ng-click="doDelete({{product}})"> 
 
         Supprimer 
 
        </ion-option-button> 
 
       </div> 
 
      </ion-item> 
 
     </ion-list> 
 
     <ion-infinite-scroll ng-if="moreDataCanBeLoaded()" icon="ion-loading-c" on-infinite="loadMoreData()" distance="100%"> 
 
     </ion-infinite-scroll> 
 
</ion-content>

, wenn ich die in der „that.showDetail“ Methode sended Produkt überprüfen, dann ist es das alte Produkt, die sended wird, selbst wenn das Produkt in den Diensten aktualisiert wurden.

Ich bin nicht Englisch für sprachliche Fehler in meinem Satz so sorry ^^ ‚

Vielen Dank im Voraus für Ihre Hilfe ^^‘

+0

that.products =„arrayOfData "; ? – Vitalii

+1

'angular.module ('app'). Service ('ProductsController', ['$ http', '$ q', 'productsServices', ProductsController])' Diese Zeile sieht nicht gut aus, es wird versucht, einen Dienst mit dem Namen zu erstellen "ProductsController" –

+0

Ich bekomme nicht, wie die globale HTML-Seite von jeder Änderung von Server oder anderen Seiten bemerkt werden konnte. Sie möchten, dass "that.products()" automatisch aktualisiert wird, ohne die globale Seite neu zu laden? – Pico12

Antwort

0

Ok habe ich den ansewer auf meine Frage finden, ich Ich ersetze den Parameter, den ich an meine "that.showDetail" -Funktion sende. Ich sende das Objekt nicht mehr direkt, sondern den Index meines Artikels.

<ion-item ng-repeat="product in that.products() track by product.ProductId" href="#" ng-click="that.showDetail({{$index}})">

Ich denke, dass Winkel nicht in einem ng-Klick-Aufruf injiziert diese aktualisieren ^^‘

Vielen Dank für Ihre Zeit Jungs

Verwandte Themen