2014-02-11 7 views
1

왜 내 유성 응용 프로그램에는 아무 것도 표시되지 않습니까?

Template.data.champ = Meteor.call("checkLeague", function(error, results) { 
     console.log(results.data.data); 
     return results.data.data; 
}); 

그래서는 CONSOLE.LOG에서 잘 보여줍니다 파일 내 client.js이있어하지만 실제로 웹 페이지에 표시되지 않습니다.

이것은 핸들 템플릿 (매우 핸들 바의 측면에서 제한된다)에 대한 이해에서

<body> 
    {{> hello}} 
    {{> data}} 
</body> 

<template name="hello"> 
    <h1>Hello World!</h1> 
    {{greeting}} 
    <input type="button" value="Click" /> 
</template> 

<template name="data"> 
    {{#each champ}} 
     {{name}} 
    {{/each}} 
</template> 

하지만 객체를 통해 {{#each 챔피언}} 반복 내 html 파일? 그러나 어떤 이유로 페이지에 아무것도 표시되지 않습니다.

이것은 개체 구조 (콘솔에 표시됨)입니다.

Object {Aatrox: Object, Ahri: Object, Akali: Object, Alistar: Object, Amumu: Object…} 
Aatrox: Object 
    id: "Aatrox" 
    image: Object 
    key: "266" 
    name: "Aatrox" 
    title: "the Darkin Blade" 
    __proto__: Object 
Ahri: Object 
Akali: Object 
Alistar: Object 
Amumu: Object 
Anivia: Object 
Annie: Object 
Ashe: Object 

그래서 기본적으로 개체 값을 갖는 속성을 가진 개체를 전달하고 있습니다. 나는 {{#each}가 속성을 반복하고 객체 (객체) 인 값에 액세스 할 수 있다고 가정하고 템플릿에서 해당 변수의 name 속성에 액세스하려고 시도하지만 작동하지 않습니다.

답변

1

Peppe의 대답은 올바른 것입니다. 이것은 반응이 없지만 메서드 호출로 인해 데이터가 전달되기 때문에 극복하기가 어렵다는 것을 명심하십시오.

1

세션 변수 사용에 관한 내용 외에도. 나는 또한 당신이 당신의 목록을 키의 목록 대신 단지 객체의리스트로 변환 할 필요가 있다고 생각한다.

그래서 대신 당신이 당신의 현재 구조에서이 구조를 얻으려면 단지이

var champ = [{ id: "Aatrox", 
    image: Object, 
    key: "266", 
    name: "Aatrox", 
    title: "the Darkin Blade"}, 
    { id: "Ahri", 
    image: Object, 
    key: "267", 
    name: "Ahri", 
    title: "Hitchhikers Guide"}, ... ]; 

return champ; 

같은 데이터를 만들고 싶어 당신은 내가 문제가 있다고 생각

var champ = []; 

for (var a in results.data.data) { 
    for (var key in results.data.data[a]) { 
     champ.push(results.data.data[a][key]); 
    } 
} 
+1

현재 구조로 어떻게 구조체를 가져올 수 있습니까? 데이터는 실제로 jSON 객체를 반환하는 API에서 가져옵니다. – Maaz

+0

방금 ​​내 대답을 업데이트했습니다. 데이빗 웰던 (David Weldon)이 말한 것을 할 필요가 있다고 생각합니다. –

1

같은 것을 수행해야합니다 #each가 배열을 기다리고 있고 객체를 전달하고 있습니다. 귀하의 도우미에서 return _.toArray(result.data.data);을 시도하십시오.

유성우 문서에서는 아무런 언급도 찾을 수 없지만 handlebars.js docs mentions Array입니다. 또한, 전에 배열을 전달하고 그것을 작동합니다. Meteor.call에 관한 문서에서

+0

슬프게도 작동하지 않습니다. – Maaz

+0

예, 메서드 콜백에서 반환을보고 도우미의 반환과 혼동. 아래의 Peppe의 답변에서 이것을 지적하고 [템플릿 도우미에서 Meteor.call을 사용하는 방법은 여기에서 설명합니다] (http://stackoverflow.com/a/15186805/728291). – user728291

+1

Meteor.call 문제에 대한 다른 답변을 한 다음에는 실제로 핸들 바가 배열을 필요로하는 것 같아서 귀하의 답변이 확실히 도움이되었습니다. 감사! – Maaz

2

:

당신은 (함수가 직렬화하지 않기 때문에, 방법에 대한 인수하지 수) 마지막 인수로 콜백 함수를 포함하는 경우, 방법 비동기 적으로 실행됩니다. 에서 아무 것도 반환하지 않으며 예외를 throw하지 않습니다.

값이 무엇이든 상관없이 "특별히 아무것도"아닙니다 (콜백에서 반환 한 내용은 절대로 사용되지 않습니다).

Session.setDefault('theData', []) 

Meteor.call("checkLeague", function(error, results) { 
    Session.set('theData', results.data.data) 
}); 

Template.data.champ = function(){ 
    return Session.get('theData') 
} 

을하지만 대신 컬렉션 이동하려고 할 것입니다 :

이 같은 세션에 저장할 수 있습니다.

Template.data.created = function() { 
    Meteor.call('checkLeague', function(error, results) { 
    Session.set('champ', results.data.data); 
    }); 
}; 

Template.data.champ = function() { 
    return Session.get('champ'); 
}; 

데이터는 템플릿이 생성 될 때로드, 비동기 세션 변수에 저장됩니다 여기에이 상황에 대처하는 방법에 대한 옵션입니다 -

+1

그러면이 문제에 대한 최선의 해결책은 무엇입니까? 와드를 읽었을 때 그 결과는'result'에서 얻을 수 있고'error'에서 오류가있는 것처럼 보입니다. – Maaz

+0

@Maaz Dou! 내 대답을 바꿨지 만 David이 이미 그 해결책을 게시했습니다 ^^ ' –

관련 문제