A seconda di dati degli attributi come nascondere il tag e la visualizzazione in un altro div

Question

Questa è la per ogni ciclo per rendere i dati

<ul data-bind="foreach: { data: PersonData, as: 'ref' }"> 
     <li> 
      <a data-bind="attr: { data: ref.Filter }" class="filterbtn"> 
       <span data-bind="html: ref.Name"></span> 
       <span data-bind="text: ref.Age" class="age"></span> 
      </a> 
     </li> 
    </ul> 

voglio nascondere se l'attributo dati valore è data="people" e visualizzarli in un altro div .

Come posso ottenere questo risultato?

Grazie in anticipo!

Answer 1

È necessario disporre di una messa a punto calcolato per rendere le cose a lavorare

vista:

<ul data-bind="foreach: { data: PersonData}"> 
    <li> <a data-bind="attr: { data: Filter },visible:Filter!='people'" class="filterbtn"> 
       <span data-bind="html: Name"></span> 
       <span data-bind="text: Age" class="age"></span> 
      </a> 
    </li> 
</ul> 

<div data-bind="foreach:data"> <span data-bind="html: Name"></span> 
<span data-bind="text: Age" class="age"></span> 
</div> 

ViewModel:

var ViewModel = function() { 
    var self = this; 
    self.PersonData = ko.observableArray([{ 
     'Filter': 'people', 
     'Name': 'cool', 
     'Age': '1' 
    }, { 
     'Filter': 'nope', 
     'Name': 'cooler', 
     'Age': '2' 
    }, { 
     'Filter': 'people', 
     'Name': 'hotter', 
     'Age': '3' 
    }]) 

    self.data = ko.computed(function() { 
     return ko.utils.arrayFilter(self.PersonData(), function (item) { 
      return item.Filter === "people"; //do a case check here(if) 
     }); 
    }); 
}; 

ko.applyBindings(new ViewModel()); 

lavorare violino fino here