'applyBindings'에 해당되는 글 1건

  1. 2014.09.05 knockout - 기본 객체

knockout - 기본 객체

Posted by 단순대왕 Knockout : 2014. 9. 5. 10:25

기본 객체

Observable 객체

Knockout 라이브러리는 모델을 Observable 객체라고 부릅니다. 모델의 변화를 계속 감시하므로 모델을

Observable 객체라고 부릅니다.

예) // 객체 생성 - ko.observable();

var name = ko.observable('imdsoho');    

name('HAPPY');

alert(name());

[결과] HAPPY


ObservableArray 객체

Knockout 라이브러리는 컬렉션을 ObservableArray 객체라고 부릅니다.

예) // 객체 생성 - ko.observableArray();

var people = ko.observableArray([    // 컬렉션 선언

{name: ko.observable(''),

region: ko.observable('')}

,{name: ko.observable(''),

region: ko.observable('')

}

]); 

people.push({                        // 데이터 추가

name: ko.observable(''),

region: ko.observable('')

});

alert( people() );                      // 데이터 조회 - 함수 형태로 실행해야 객체의 요소를 가져올 수 있음.

people.remove(people()[0]);    // 데이터 삭제


ko.utils.arrayForEach() 메소드

ObservableArray 객체는 ko.utils.arrayForEach() 메서드로 반복문을 적용합니다.

예)

ko.utils.arrayForEach(people(), function(item){

console.log(item);

});


Knockout 라이브러리의 ObservableArray 객체도 일반 자바스크립트 배열이 아닙니다.

ko.toJS()ObservableArray 객체를 자바스크립트 배열로 변환합니다.

ko.toJSON()ObservableArray 객체를 JSON 형식으로 변환합니다.

예)

console.log(ko.toJS(people));

console.log(ko.toJSON(people));


ko.applyBindings() 

기본 객체는 ko.applyBindings() 메서드의 매개변수로 입력하면 뷰와 자동으로 동기화합니다.

예)

ko.applyBindings({

people: ko.observable([{},{}])

});

이렇게 뷰와 모델을 연결하면 자동으로 뷰와 뷰모델이 동기화되는 패턴이 MVVM 패턴입니다.

'Knockout' 카테고리의 다른 글

Knockout 바인딩 종류  (0) 2014.09.11
knockout - 바인딩  (0) 2014.09.05
MVVM 패턴  (0) 2014.09.05
  
 «이전 1  다음»