Zeige nur geprüfte Artikel eckig

Question

Ich habe eine Seite mit Kontrollkästchen, und ich versuche, die Artikel, die der Benutzer in den Warenkorb überprüft hat, wieder anzuzeigen, während sie überprüfen.

Dies geschieht, aber wenn sie die Elemente deaktivieren, nicht aus dem Warenkorb entfernen. Kannst du helfen?

<table class="products-table-class"> 

      <tr> 
       <th>News</th> 
      </tr> 
      <tr data-ng-repeat="product in products | filter:{  category: 'News' }" > 


       <td>{{ product.product }}</td> 
       <td><input type="checkbox" ng-model="ids[product.product]"></td> 
      </tr> 



</table> 
<div class="featured-info"> 
     <h3>Basket</h3> 

     <ul> 
      <li ng-repeat="(key, value) in ids ">{{key}}</li> 
     </ul> 
    </div> 

Answer 1

Ich glaube, Sie hier Ausgabe ist in Ihrem Objekt-IDs. Wenn der Benutzer ein Kontrollkästchen deaktiviert, wird er nicht aus dem Objekt entfernt. Es ändert einfach den Wert auf wahr oder falsch.

{ 
    '123' : true, 
    '1234' : false 
} 

So wird das Produkt nie aus dem Warenkorb entfernt. Sie können eine ng-if auf der ng-Wiederholung hinzufügen, um zu überprüfen, ob der Wert wahr ist.

<li ng-repeat="(key, value) in ids " ng-if="value === true">{{key}}</li> 

Der Wert könnte eine Zeichenfolge anstelle eines booleschen sein, damit es so aussehen könnte. Ich kann mich nicht mehr an meinen Kopf erinnern.

<li ng-repeat="(key, value) in ids " ng-if="value === 'true'">{{key}}</li> 

Auch hier ist der Link zu den Winkel docs https://docs.angularjs.org/api/ng/input/input%5Bcheckbox%5D