관찰 가능한 배열의 항목이 목록에 추가되지 않았습니다 KO

Question

로드 된 목록에서 일부 데이터를 가져 와서 관측 가능한 배열에 추가하고 다른 목록에 표시한다고 가정합니다. 데이터가 화면에 표시되지 않는다면 여기에 코드

self.addData = function (val) { 
 
     
 
     self.finalList().push(val); 
 

 
     alert(val.LATIN_DESC); 
 

 
    }

<div class="container"> 
 
          <h2> Added servcies</h2> 
 
          <div class="row" style="height:20vh; overflow:auto;"> 
 
           <div class="col-md-3"> 
 
            <ul data-bind="foreach:finalList"> 
 
             <li class="list-group-item"> 
 
              <div class="col-xs-3"> 
 
               <b data-bind="text:LATIN_DESC , value: SYS_KEY"></b> 
 
              </div> 
 
             </li> 
 
            </ul> 
 
            
 
           </div> 
 
          </div> 
 
          
 
         </div>

observable array 현재 보유하고 어떤

Answer 1

observableArray에 대한 @connexo와 b 요소 바인딩시에는 b 요소가 값을 변경하지 않기 때문에 텍스트가 아닌 값을 사용하는 것이 좋습니다.

 
function TestVM(){ 
 
    var self = this; 
 
    self.finalList = ko.observableArray(); 
 
    self.addData = function (val) { 
 
     
 
     self.finalList.push(val); 
 

 
     alert(val.LATIN_DESC); 
 

 
    } 
 
    
 
    self.addData({LATIN_DESC: 'RR', SYS_KEY: 'GG'}); 
 
} 
 
    
 
ko.applyBindings(new TestVM())

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script> 
 
<div class="container"> 
 
          <h2> Added servcies</h2> 
 
          <div class="row" style="height:20vh; overflow:auto;"> 
 
           <div class="col-md-3"> 
 
            <ul data-bind="foreach:finalList"> 
 
             <li class="list-group-item"> 
 
              <div class="col-xs-3"> 
 
               <b data-bind="text:LATIN_DESC +'-'+ SYS_KEY"></b> 
 
              </div> 
 
             </li> 
 
            </ul> 
 
            
 
           </div> 
 
          </div> 
 
          
 
         </div>

Answer 2

self.finalList() 반환, 그리고 다음 self.finalList().push(val)은 (자바 스크립트의 기본 Array.Prototype.push() 방법을 사용하여) 반환 된 결과에 값을 밀어 아닌 관찰 가능한 배열 자체. 대신 녹아웃 관측 배열의 푸시 방법을 사용하십시오 :

self.finalList.push(val).