다음을 통해 공유


LightSwitch 응용 프로그램에서 로컬 정보 표시

이 단원에서는 로컬 속성을 추가하여 LightSwitch 응용 프로그램의 화면을 사용자 지정하는 방법을 배웁니다. 로컬 속성은 데이터 소스에 없는 정보를 표시합니다.

로컬 속성 추가

화면 디자이너를 사용하여 화면 컨트롤을 사용자 지정할 뿐 아니라 데이터 항목을 추가할 수도 있습니다. 예를 들어 계산된 값을 표시할 수 있는 로컬 속성을 추가할 수 있습니다.

로컬 속성을 추가하려면

  1. 솔루션 탐색기에서 BrowseOrders.lsml 노드의 바로 가기 메뉴를 열고 열기를 선택합니다.

  2. 도구 모음에서 데이터 항목 추가 단추를 선택합니다.

  3. 데이터 항목 추가 대화 상자에서 로컬 속성 옵션 단추를 선택합니다. 형식 목록에서 정수를 선택한 다음 확인 단추를 선택합니다.

    Property1이라는 새 노드가 화면 디자이너의 왼쪽 창에 추가됩니다.

    로컬 속성 Property1

  4. Property1 노드를 선택합니다. 속성 창에서 이름 속성을 선택한 다음 NumberOfOrders를 입력합니다.

    이름이 화면 디자이너의 왼쪽 창에서도 변경됩니다.

  5. 화면 디자이너에서 가운데 창의 명령 모음 노드 바로 아래로 NumberOfOrders 노드를 끌어옵니다.

  6. 응용 프로그램을 실행하고 주문 찾아보기 화면을 엽니다.

    이제 화면 이름 아래에 주문 수 레이블이 표시되며 값은 표시되어 있지 않습니다.

  7. 응용 프로그램을 닫고 디자인 모드로 돌아갑니다.

로컬 속성의 값을 표시하려면

  1. 화면 디자이너의 왼쪽 창에서 주문 노드를 선택합니다.

  2. 도구 모음 리본코드 작성 목록에서 생성됨을 선택합니다.

    코드 편집기가 열리고 created 메서드가 표시됩니다.

  3. created 메서드에 다음 코드를 추가합니다.

    myapp.BrowseOrders.created = function (screen) {
        screen.getOrders().then(function (results) {
            screen.NumberOfOrders = screen.Orders.data.length;
        })
    };
    

    화면이 만들어지면 이 코드가 주문 엔터티의 주문 수를 계산합니다. 계산된 값은 주문 수 필드에 표시됩니다.

  4. 응용 프로그램을 실행하고 주문 찾아보기 화면을 엽니다.

    주문 수가 주문 수 필드에 표시되어 있음을 알 수 있습니다.

  5. 응용 프로그램을 닫고 디자인 모드로 돌아갑니다.

자세히 보기

이 단원에서는 계산된 값을 화면에 표시하는 로컬 속성을 만드는 방법에 대해 살펴보았습니다. 이 경우 주문 컬렉션에 대해 created 메서드를 사용하여 총 주문 수를 주문 엔터티에 반환했습니다. 코드가 Promise 개체를 사용하여, screen.Orders.data.length 속성의 값을 반환하기 전에 데이터가 로드되도록 합니다.

로컬 속성을 사용하여 계산된 값을 표시할 수 있을 뿐 아니라 사용자의 입력 값을 수집할 수도 있습니다. 예를 들어 사용자가 지리적 위치를 지정할 때 도시 목록을 표시하는 로컬 속성을 만들 수 있습니다.

다음 단계

다음 섹션에서는 화면에 표시될 항목을 제어하는 쿼리를 만들고 사용하는 방법에 대해 배웁니다.

다음 단원: LightSwitch에서 쿼리를 사용하여 데이터 필터링

참고 항목

작업

방법: HTML 화면에 로컬 속성 추가

기타 리소스

LightSwitch에서 화면 만들기