---
sourceDocument: 호주 고객 서비스 관리
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/ko-KR/customer-service-management

 Release :

    - australia

ft:locale :

    - ko-KR

ft:publication_title :

    - 호주 고객 서비스 관리

ft:clusterId :

    - csm

bundleId :

    - csm

workflow :

    - Customer and Industry


---

# 카탈로그 찾아보기 구성요소에 대한 샘플 코드

# 카탈로그 찾아보기 구성요소에 대한 샘플 코드 {#ariaid-title1}

* 릴리스 버전: Australia
* 
* 업데이트 날짜 2026년 03월 12일
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 소요 시간: 3분

이벤트가 트리거될 때 작업을 정의하기 위해 샘플 코드가 제공됩니다. 웹 페이지에 구성요소를 포함하기 전에 사용 사례에 대한 샘플 코드를 업데이트합니다.

## 샘플 코드 {#we-catalog-browse-samp-code__section_rcm_ndt_zfc}

    { 

    'CATALOG_BROWSE#COMPONENT_READY' : (e) => { 

    // This event is dispatched when a component is ready and usable. 

    }, 

    'CATALOG_BROWSE#CATALOG_ITEM_SELECTED' : (e) => { 

    // This event is dispatched when a catalog item is selected. 

    var {catalog_item_details} = e.detail.payload; 

    // Logic to construct the URL based on the catalog item details 

    let redirectURL; 

    const type = catalog_item_details.type; 

     

    if (type === 'catalog_item' || type === 'record_producer') { 

    redirectURL = '/catalog_form?emb_recordid=' + catalog_item_details.sys_id; 

    } else if (type === 'content_item') { 

    const content_type = catalog_item_details.content_type; 

    if (content_type === 'kb') { 

    redirectURL = '/article_view?emb_recordid=' + catalog_item_details.kb_article; 

    } else if (content_type === 'external') { 

    redirectURL = catalog_item_details.url; 

    } else if (content_type === 'dynamic') { 

    const dynamicContentItemDetails = catalog_item_details.dynamicContentItemDetails; 

    // Check for 'Playbook' dynamic content type 

    if(dynamicContentItemDetails.dynamicContentType === 'c0e6a71443923110f6669c7385b8f20a') 

    redirectURL = '/playbook_intake?emb_playbook_title=' + dynamicContentItemDetails.content.title + '&emb_table=' + dynamicContentItemDetails.content.table + '&emb_record_generator=' + dynamicContentItemDetails.content.query + '&emb_playbook_experience=' + dynamicContentItemDetails.content.playbook_experience; 

    } 

    } 

    // Redirect to the respective component page 

    open(redirectURL, '_self'); 

    }, 

    'CATALOG_BROWSE#COMPONENT_EMPTY' : (e) => { 

    // This event is dispatched when a component has nothing to display. 

    }, 

    'CATALOG_BROWSE#COMPONENT_ERROR' : (e) => { 

    // This event is dispatched when a component encounters an error. 

    var {errorMessage, errorType} = e.detail.payload; 

    console.log(errorMessage, errorType); 

    } 

     
**관련 태스크**   

* [카탈로그 찾아보기 구성요소 인스턴스 구성](https://servicenow-prod.fluidtopics.net/QVge2B8anq2rrAwRY4hSyw "사용자가 웹 사이트에 포함하여 다양한 카탈로그 및 범주에서 카탈로그 항목을 찾아보고 검색할 수 있도록 카탈로그 찾아보기 구성요소 인스턴스를 구성합니다.")
* [외부 공급업체 웹 사이트에 카탈로그 찾아보기 구성요소 포함](https://servicenow-prod.fluidtopics.net/k~Y0Xj0W9tVbkNmkmRGoZQ "고객이 외부 공급업체 웹 사이트에서 구성요소를 사용할 수 있도록 인스턴스에 구성한 카탈로그 찾아보기 구성요소의 전역 코드와 구성요소 코드를 포함합니다.")  
**관련 참조**   

* [카탈로그 찾아보기에 대한 구성요소 속성](https://servicenow-prod.fluidtopics.net/sIgIfZYp5vExt8xXYE1Mmw "구성요소 속성을 사용하면 외부 공급업체 웹 사이트에서 카탈로그 찾아보기 구성요소의 동작을 구성할 수 있습니다.")
* [카탈로그 찾아보기 구성요소의 이벤트 핸들러](https://servicenow-prod.fluidtopics.net/Q_VwdA4F6P6hszKLK8RRAQ "구성요소는 특정 조건이 충족되거나 사용자 상호작용이 있을 때 이벤트를 트리거합니다. 이벤트를 사용하여 외부 공급업체 웹 페이지의 코드를 통해 작업을 실행할 수 있습니다.")