한국어 설정하기

단계

1. npm을 사용하여 한국어 리소스 패키지를 설치합니다.

   npm install @mescius/spread-sheets-resources-ko

2. app.component.ts의 script 태그 내부에 아래의 코드를 입력하여 Spreadjs 패키지를 import 합니다.

   import * as GC from "@mescius/spread-sheets";

3. 또한, 아래의 코드를 추가하여 한국어 리소스 패키지를 import 합니다.

   import '@mescius/spread-sheets-resources-ko';

4. workbookInit 함수에 아래의 코드를 입력합니다.

   GC.Spread.Common.CultureManager.culture("ko-kr");

값 및 수식 설정

단계

1. setValue 메소드를 사용하여 셀의 값을 설정하고 setFormula를 사용하여 계산합니다.

   workbookInit($event: any) {
     //spread 초기화
     this.spread = $event.spread;
     let spread = this.spread;
     let sheet = spread.getActiveSheet();
     //값 설정하기 - Text
     sheet.setValue(1, 1, "값 설정하기");
     //값 설정하기 - Number 
     sheet.setValue(2, 1, "Number");
     sheet.setValue(2, 2, 23)
     //값 설정하기 - Text : B4에 "Text" 라는 텍스트를, C4에 "GrapeCity"라는 텍스트를 삽입합니다.
     sheet.setValue(3, 1, "Text");
     sheet.setValue(3, 2, "GrapeCity")
     sheet.setValue(4, 1, "Datetime");
     //값 설정하기 - DateTime : B5에 "Datetime" 이라는 텍스트를, C5에 오늘 날짜를 삽입합니다.
     sheet.getCell(4, 2).value(new Date(2020, 10, 7)).formatter("yyyy-mm-dd");
   }

데이터 바인딩

간단하면서도 효율적으로 데이터를 바인딩하는 방법에 대해 설명합니다.
workbookInit 함수 내부에 이어서 작성합니다.

단계

1. addSheet 메서드를 사용하여 새로운 시트를 추가합니다.

   spread.addSheet(1);

2. getSheet 메서드를 사용하여 추가한 시트를 가져옵니다.

   var sheet2 = this.spread.getSheet(1);

3. person이라는 데이터를 입력해 줍니다.

   var person = { name: '홍길동', age: 25, gender: '남', address: { postcode: '10001' } };

4. "new GC.Spread.Sheets.Bindings.CellBindingSource(person);"를 사용하여 셀 바인딩 소스를 설정합니다.

   var source = new GC.Spread.Sheets.Bindings.CellBindingSource(person);

5. 그런 다음 setBindingPath 메서드를 사용하여 지정된 시트 영역에 지정된 셀의 바인딩 경로를 설정합니다.

   workbookInit($event: any) {
      sheet2.setBindingPath(2, 2, 'name');
      sheet2.setBindingPath(3, 2, 'age');
      sheet2.setBindingPath(4, 2, 'gender');
      sheet2.setBindingPath(5, 2, 'address.postcode');
     }

6. setDataSource 메서드를 사용하여 시트의 데이터 소스를 설정합니다.

   workbookInit($event: any) {
      sheet2.setDataSource(source);
     }