데이터 변수를 문자열 리터럴로 전달하는 Patternlab 핸들 막대

Question

나는 handlebars, patternlab-node 및 gulp가있는 프로젝트에서 작업 중입니다. 지금 원자 012에 인수를 전달하려고하면 내 .hbs 파일이 작동하지 않습니다. 아래 예제를 나열했습니다.

분자 :

<div class="filter-group {{ filterGroupClass }}"> 
    {{#each filterGroupContent}} 
    {{> atoms-filter filterClass="{{filterClass}}" filterText="{{filterText}}" filterValue="{{filterValue}}" }} 
    {{/each}} 
</div> 

데이터 :

{ 
    "filterGroupClass": "test-class", 
    "filterGroupContent": [ 
    { 
     "filterClass": "", 
     "filterText": "Text", 
     "filterValue": "9" 
    }, 
    { 
     "filterClass": "closed", 
     "filterText": "Text2", 
     "filterValue": "9" 
    } 
    ] 
} 

아톰 : {{filterText}} {{filterValue}} 대신 텍스트 :

<span class="unit"> 
    <a class="filter {{filterClass}}" href="">{{filterText}} 
    <span class="value">{{filterValue}}</span> 
    </a> 
    <a class="pill-filter-close" href="">Close</a> 
</span> 

출력 지금 문자 등으로 표시되는 json 데이터에서. 하지만 그것은 json 파일에서 정보를 얻고 있다고 생각하므로 루프에서 정확한 횟수를 표시하고 있습니다.

구문 오류인지 다른 문제인지 잘 모르겠지만 어떤 도움을 받으실 수 있습니다.

Answer 1

그래서 패턴 매개 변수가 잘못 사용 된 것으로 나타났습니다 (patternlab gitter에서 나를 도와 준 Brian aka @bmuenzenmeyer에 따르면) 매개 변수는 !important과 같아야합니다. 데이터는 기본적으로 중첩 된 자식으로 전달 될 수 있으므로 json 파일에서 키의 이름을 바꿀 때 제대로 작동합니다.

아래

업데이트 JSON : 당신이 내 질문에서 볼 수 있기 때문에

{ 
    "filterGroupClass": "group-div-class", 
    "filterGroupContent": [ 
    { 
     "filterClass": "", 
     "filterText": "Text", 
     "filterValue": "9" 
    }, 
    { 
     "filterClass": "", 
     "filterText": "Text2", 
     "filterValue": "9" 
    } 
    ] 
} 

키 이름과 같이 원자는이 매개 변수가 설정 내 분자 템플릿으로 자동으로 전달 될 수 등의 변수 값을 기대하고 무엇 이하.

<div class="filter-group {{ filterGroupClass }}"> 
    {{#each filterGroupContent}} 
    {{> atoms-filter }} 
    {{/each}} 
</div>