이 기사에서는 인덱스 루프 인덱스 용 JSRENDER에 대해 설명합니다. 참조를 위해 공유하십시오. 특정 분석은 다음과 같습니다.
JSREDNER 및 JSVIEWS (JSViews는 JSRENDER를 기반으로 한 추가 캡슐화) 공식 주소 인 차세대 jQuery 템플릿이라고합니다.
https://github.com/borismoore/jsrender;
https://github.com/borismoore/jsviews.
루프는 템플릿 엔진의 필수 부분이며 루프와 관련하여 중요한 요소가 소개됩니다 : 인덱싱.
소위 색인은 루프 수입니다. 인덱스를 통해 현재 루프를 몇 번이나 얻을 수 있습니다.
독자가 공식 문서를 읽은 경우 색인을 얻는 다음과 같은 방법을 볼 수 있습니다.
데이터:
다음과 같이 코드를 복사합니다. {
이름 : [ "Maradona", "Pele", "Ronaldo", "Messi"]]]
}
템플릿 마크 업 :
다음과 같이 코드를 복사하십시오. {{for Names}}
<div>
<b> {{: #index+1}}. </b>
<span> {{: #data}} </span>
</div>
{{/을 위한}}
결과:
다음과 같이 코드를 복사하십시오. 1. Maradona
2. 펠레
3. 호날두
4. 메시
인덱스는 루프에서 특수 리터럴 #index에 의해 얻을 수 있으며,이 경우 각 이름을 나타냅니다.
다음으로 몇 가지 트릭과 위의 예를 들어 보겠습니다. 그러나 이번에는 M으로 시작하는 이름 만 표시하기를 바랍니다.
데이터:
다음과 같이 코드를 복사합니다. {
이름 : [ "Maradona", "Pele", "Ronaldo", "Messi"]]]
}
템플릿 마크 업 :
다음과 같이 코드를 복사하십시오. {{for Names}}
{{if #data.indexof ( "m") == 0}}
<div>
<b> {{: #index+1}}. </b>
<span> {{: #data}} </span>
</div>
{{/만약에}}
{{/을 위한}}
결과:
다음과 같이 코드를 복사 할 수 없습니다 (중첩보기) : #getIndex () 1을 사용하십시오. 마라도나
사용할 수 없음 (중첩보기) : #getIndex () 1을 사용하십시오. 메시
나는 단순히 if 판단을 추가했고 실제로 오류를보고했습니다!
문제는 #index에 있습니다. 오류 메시지는 매우 명확합니다. #index 대신 #getIndex ()를 사용할 수 있습니다.
교체 된 코드를 시도하십시오.
데이터:
다음과 같이 코드를 복사합니다. {
이름 : [ "Maradona", "Pele", "Ronaldo", "Messi"]]]
}
템플릿 마크 업 :
다음과 같이 코드를 복사하십시오. {{for Names}}
{{if #data.indexof ( "m") == 0}}
<div>
<b> {{: #getIndex ()+1}}. </b>
<span> {{: #data}} </span>
</div>
{{/만약에}}
{{/을 위한}}
결과:
다음과 같이 코드를 복사하십시오. 1. Maradona
4. 메시
이게 왜? 간단히 말해서 {{if}}가 일반 데이터 범위를 생성하지는 않지만 숨겨진 범위를 방해하기 때문입니다. 즉, {{if}}은 일반 데이터의 가시성을 차단하지는 않지만 (전달한 데이터) 숨겨진 데이터의 가시성을 방해합니다 (#index, #parent). 이것은 단순한 이해이며, 표준이 아닌이 프레임 워크의 결함이기 때문에 그것에 들어갈 필요가 없습니다.
따라서이 기사는 독자에게 중요한 결론을 제공합니다. #getIndex ()를 사용하여 인덱스를 얻고 응용 프로그램이 간단하지 않은 한 #index를 사용하지 마십시오.
이 기사가 모든 사람의 JSRender 학습에 도움이되기를 바랍니다.