[javascript] 핸들 막대의 인덱스를 사용하여 액세스 배열 항목에 어떻게 액세스합니까?

JAVASCRIPT / 글쓴이

핸들 바 템플릿 내에서 배열의 항목 인덱스를 지정하려고합니다.

{
  people: [
    {"name":"Yehuda Katz"},
    {"name":"Luke"},
    {"name":"Naomi"}
  ]
}

이것을 사용하여 :

<ul id="luke_should_be_here">
{{people[1].name}}
</ul>

위의 방법을 사용할 수 없다면 어떻게 배열 내의 spefic item에 접근 할 수있는 helper를 작성합니까?

답변

이 시도:

<ul id="luke_should_be_here">
{{people.1.name}}
</ul>

답변

index 앞에 추가 점이있는 다음 은 예상대로 작동합니다. 여기서 대괄호는 인덱스 다음에 다른 속성이있을 때 선택 사항입니다.

{{people.[1].name}}
{{people.1.name}}

그러나 대괄호는 다음에 필요합니다 .

{{#with people.[1]}}
  {{name}}
{{/with}}

후자의 경우, 대괄호없이 색인 번호를 사용하면 다음 중 하나를 얻을 수 있습니다.

Error: Parse error on line ...:
...     {{#with people.1}}
-----------------------^
Expecting 'ID', got 'INTEGER'

따로 : 대괄호는 세그먼트 리터럴 구문에 사용되며 , 그렇지 않으면 유효하지 않은 실제 식별자 (인덱스 번호 아님)를 나타냅니다. 에서 자세한 내용 유효한 ID는 무엇입니까?

(YUI의 핸들 바로 테스트했습니다.)

2.xx 업데이트

이제이를 위해 get도우미를 사용할 수 있습니다 .

(get people index)

색인이 문자열이어야한다는 오류가 발생하면 다음을 수행하십시오.

(get people (concat index ""))

답변

{{#each array}}
  {{@index}}
{{/each}}

답변

문서화되지 않은 기능이 게임이 아닌 경우 여기에서 동일한 기능을 수행 할 수 있습니다.

Handlebars.registerHelper('index_of', function(context,ndx) {
  return context[ndx];
});

그런 다음 템플릿에서

{{#index_of this 1}}{{/index_of}}

보류하기 전에 위의 내용을 작성했습니다. 

this.[0]

나는 당신의 도우미를 쓰지 않고 핸들 바로 너무 멀리 나가는 것을 볼 수 없습니다.

답변

동적 변수를 사용하려는 경우

작동하지 않습니다.

{{#each obj[key]}}
...
{{/each}}

해야 할 일 :

{{#each (lookup obj key)}}
...
{{/each}}

핸들 바 조회 도우미 및 핸들 바 하위 표현식을 참조하십시오 .

답변

첫 번째 / 마지막으로 가져 오려면 이것을 시도하십시오.

{{#each list}}

    {{#if @first}}
        <div class="active">
    {{else}}
        <div>
    {{/if}}

{{/each}}


{{#each list}}

    {{#if @last}}
        <div class="last-element">
    {{else}}
        <div>
    {{/if}}

{{/each}}

답변

each현재 항목의 컨텍스트에서 다른 배열에 액세스하려는 경우 와 같이 배열을 반복하는 동안 이와 같이 수행합니다.

다음은 예제 데이터입니다.

[
  {
    이름 : 'foo',
    속성 : [ 'boo', 'zoo']
  },
  {
    이름 : 'bar',
    속성 : [ 'far', 'zar']
  }
]

다음은 첫 번째 항목을 attr배열 로 가져 오는 핸들 막대 입니다.

{{#each player}}
  <p> {{this.name}} </ p>

  {{#with this.attr}}
    <p> {{this. [0]}} </ p>
  {{/와}}

{{/마다}}

출력됩니다

<p> foo </ p>
<p> 부 </ p>

<p> 바 </ p>
<p> 먼 </ p>