녹아웃 관찰 가능한 배열 IndexOf 메서드

Question

cityArray.indexOf(data.results[index].City) === -1 

각 항목이 객체 인 knockoutObservable 배열에 대해 indexOf 메서드를 사용하려면 어떻게해야합니까? cityArray는 City라는 속성이있는 객체를 포함합니다.

Answer 1

cityArray.indexOf( 
    ko.utils.arrayFirst(ko.utils.unwrapObservable(cityArray), function(cityObj) { 
     return ko.utils.unwrapObservable(cityObj.City) == 'WallaWalla'; 
    } 
) 

ko.utils.unwrapObservable 기능 것이다() 개체 그것을 필요로하고 의지가 수행되지 않은 경우하지 않을 경우. Lightweight ... V2.3에서는 js에 너무 많은 글자가 두려워 할 때를 대비해 ko.unwrap을 사용할 수 있습니다.

arrayFirst가 객체를 반환하면 indexOf가 객체의 비교를 가져오고 index가 있어야합니다 .- 존재하지 않으면 색인을 얻습니다. ... arrayFirst와 일치하는 것이 없으면 null를 얻는다.

Answer 2

답장을 보내 주셔서 감사합니다. 내가 indexOf 메서드를 사용하여 관찰 가능한 배열에 항목이 이미 있는지 확인하려고했습니다. 대신 나는 이제 ko.utils.arrayGetDistinctValues를 사용하므로 더 이상 indexOf 메서드를 사용할 필요가 없습니다. 그러나 arrayGetDistinctValues가 객체 배열에서 작동하지 않기 때문에 먼저 값을 일반 배열에 복사 한 다음이 배열에서 함수를 사용했습니다.

Answer 3

이 내가 당신은 할 수 없습니다

var viewModel = function() { 
 
    var self = this; 
 

 
    self.suggestions = ko.observableArray([]); 
 
    self.filterText = ko.observable(''); 
 

 
    self.filterText.subscribe(function(newValue) {}); 
 

 
    self.suggestionsFilter = ko.computed(function() { 
 
    
 
    if (self.filterText() === '') { 
 
     return self.suggestions(); 
 
    } else { 
 
     return ko.utils.arrayFilter(self.suggestions(), function(item) { 
 

 
     var filterResults = item.option.toLowerCase().indexOf(self.filterText().toLowerCase()) == 0; 
 
     return filterResults; 
 

 
     }); 
 
    } 
 
    }); 
 
};

<div class="col-md-6 postcode-search" id="js-postcode-search-suggestions"> 
 
    <input id="name-search" class="form-control" type="search" name="postcode" minlength="1" placeholder="Postcode or Address" data-bind="textInput: filterText" /> 
 
    <div class="col-md-12" data-bind="visible: suggestions().length > 1" style="display: none"> 
 
    <ul class="suggestions" data-bind="foreach: suggestionsFilter"> 
 
     <li class="pad-top-bottom"> 
 
     <a href="#"> 
 
      <span class="option" data-bind="html: option"></span> 
 
     </a> 
 
     </li> 
 
    </ul> 
 
    </div> 
 
</div>