IT TIP

HAML 내의 Javascript 내의 Ruby 메서드

itqueen 2020. 12. 15. 20:39
반응형

HAML 내의 Javascript 내의 Ruby 메서드


양식에 새 필드를 추가하는 jQuery 스크립트가 있으며이 필드에는 배열의 동적 정보가 포함되어 있습니다. 문제는 HAML 들여 쓰기를 깨고 오류를 일으키지 않고 자바 스크립트 내에서 선택 필드의 옵션을 채우기 위해 array.each를 추가하는 방법을 알아낼 수 없다는 것입니다.

작동하지 않는 최선의 시도는 다음과 같습니다.

%script(type="text/javascript")  
  $('#mylink').click(function() {  
  $('#mylink').after('<select>  
  - myarray.each do |options|  
     <option value="#{options.id}">#{options.name}</option>  
  </select>);  
  )};

또한 운없이 : javascript 필터로 시도했습니다.


일반적으로 무언가가 고통 스러우면 까다로운 부분을 도우미 또는 부분적으로 리팩토링하고 그것을 호출해야 함을 의미합니다.

// some_helper.rb
def new_snazzy_select_tag(options = [])
  select_tag 'tag_name_here', options.map { |option| [option.id, option.name] }
end

또한 :javascript필터를 사용하여 자바 스크립트를 렌더링 해야합니다 . 스크립트 태그에 삽입하고 들여 쓰기를 허용하기 때문입니다.

마지막으로 필터를 #{ruby_expression}포함하여 haml의 어느 곳에서나 사용할 수 있습니다 :javascript. 이는 루비 표현식의 결과를 html 요소의 직접 내용이 아닌 곳에 출력해야 할 때 매우 편리합니다.

// some_view.html.haml
:javascript
  $('#mylink').click(function() {  
    $('#mylink').after("#{escape_javascript new_snazzy_select_tag(myarray)}");
  };

이것을 시도하면 작동합니다 (내가 한 일은 다섯 번째 줄에서 단일 공백을 제거하고 여섯 번째 줄에 닫는 따옴표를 추가하는 것뿐이었습니다) :

%script(type="text/javascript")
  $('#mylink').click(function() {
  $('#mylink').after('<select>
  - @myarray.each do |options|
    <option value="#{options.id}">#{options.name}</option>
  </select>');
  )};

그러나 루비 스크립트 또는 일종의 프레임 워크로 이것을 실행한다고 가정하면 왜 템플릿 외부에서 수행하지 않습니까? 아마도 가장 적절할 것입니다. rails / sinatra 및 기타 프레임 워크에서는 도우미 메서드를 사용하여이 작업을 수행 할 수 있습니다. haml 참조를 보면 실제로 -루비를 평가 하는 사용하지 않는 것이 좋습니다 .

참조 URL : https://stackoverflow.com/questions/2640863/ruby-methods-within-javascript-within-haml

반응형