2009-10-01 5 views
1

나는 이것을위한 해결책을 가지고있다. 그러나 나는 약간의 의견을 얻고 이것을하기위한 더 좋은 방법이 있는지 알고 싶었다.레일즈와 자바 스크립트로 템플릿 공유하기

내 문제는 기본적으로 RoR에 의해로드 될 때 생성 된 데이터 목록이며 JS 컨트롤을 통해 하위 집합을 볼 수 있다는 것입니다. 기본적으로 동일한 HMTL 인 두 가지 버전을 지원하지 않아도됩니다. 그래서 내 해결책은 이것이다, 내가 이렇게 보이는 부분 루비가 : 나는 루비 부분을 렌더링 할 때

<% value1 = jsmode ? '#{value1}' : object.value1 
value2 = jsmode ? '#{value2}' : object.value2 $> 
<div class="object_template"> 
<div><$= value1 $></div> 
<div><%= value2 %></div> 
</div> 

그래서, 내가 거짓의 jsmode 전달을하며 정상적인 부분처럼 렌더링합니다. 그런 다음 템플릿의 ID를 가진 div로 다시 래핑 된 부분을 렌더링합니다.하지만 이번에는 jsmode가 true로 렌더링됩니다. 그러면 html이 # {} 문자열로 렌더링됩니다. 나는 다음과 같은 템플릿 객체를 프로토 타입 템플릿을 전달할 수 있습니다

new Template($('template')).evaluate({value1: '111', value2: '222'}); 

그래서 제 질문은,이 할 수있는 더 좋은 방법이있다?

큰 따옴표로 감싸는 경우 # {} 구문을 사용하여 변수를 RoR에 전달할 수 있지만 JS 템플릿 용으로 렌더링하려면 # {}이 필요하다는 것을 알고 있습니다.

생각하십니까?

답변

1

일반적인 접근 방식이 좋게 보이고 실제로는 이전에했던 것보다 조금 나아졌습니다.

그러나 실제로 JS 버전을 div로 렌더링 한 다음이를 프로토 타입 템플릿에 전달하는 것처럼 보입니다. 템플릿은 또한 문자열을 받아 들여 원시 JSP 템플릿을 그대로 전달할 수 있습니다. 뭔가 빠뜨린 것이 아니라면 #template div는 자체적으로 필요하지 않습니다. 문자열 경로가 아마도 더 좋은 방법 일 것입니다. 레일에서

, 아마 다음과 같이 보일 것입니다 :

JS_ESCAPE_MAP = { 
    '\\' => '\\\\', 
    '</' => '<\/', 
    "\r\n" => '\n', 
    "\n" => '\n', 
    "\r" => '\n', 
    '"'  => '\\"', 
    "'"  => "\\'" } 

이 당신은 결과와 끝까지해야한다, 당신의 제안 템플릿을 제공한다는 것을 의미 :

<script type="text/javascript"> 
    var raw_template = "#{escape_javascript(render(:partial => 'template', :locals => { :jsmode => true }))}"; 
    var output = new Template(raw_template).evaluate({value1: '111', value2: '222'}); 
    // Do something with the output 
</script> 

escape_javascript는 다음 맵을 사용합니다

var raw_template = "<div class=\"object_template\">\n<div>#{value1}<\/div>\n<div>#{value2}<\/div>\n<\/div>"; 

다음 중 무엇을해야합니까? 멋지게 속인다.

+0

이것은 내가하고 싶은 일종이지만, 템플릿의 개행을 염려했습니다. 아직 테스트하지는 않았지만 escape_js를 사용하여 이것을 한 줄로 변환합니까? – Rodrigo

+0

그냥 내 덧글에 추가 할 수 있습니다. JS에는 HEREDOC 구조가 없습니다. 나는 어떤 종류의 일을하고 싶습니다. HEREDOC render partial HEREDOC 내가 찾은 것은 그것을 위해 HTML을 사용하는 사람들이었습니다. – Rodrigo

+0

escape_javascript의 작동 방식을 명확히하기 위해 내 게시물을 편집했습니다. –