Передать jQuery $ (this) через действие ember.js?

0

Поэтому в моем коде у меня есть простой faq, который выглядит ниже.

<section class="faq-section">
    <label class="question">Q:This is a Questions?</label>           
    <p class="answer">This is a an answer </p> 
</section>
<section class="faq-section">
    <label class="question">Q:This is a Questions?</label>           
    <p class="answer">This is an answer</p> 
</section>

Я хочу, чтобы пользователь мог нажать на вопрос и показать ответ. В обычном jQuery я бы сделал что-то вроде этого:

$( ".question" ).click().next( ".answer" ).toggle('slow');

Как бы я сделал что-то подобное, используя маршрут и действие

<section class="faq-section">
    <label class="question" {{action openQuestion}}>Q:This is a Questions?</label>           
    <p class="answer">This is an answer</p> 
</section>
Теги:
ember.js

1 ответ

1
Лучший ответ

Ember обычно хочет, чтобы вы избегали взаимодействия с DOM напрямую, поэтому я не думаю, что там была встроена поддержка такого типа использования. Но у меня есть аналогичный вариант использования, и я делаю что-то вроде этого:

<section class="faq-section">
    <label class="question" {{action 'openQuestion' questionId}}>blah</label>
    <p class="answer" {{bind-attr data-question-id=questionId}}>blah</p>
</section>

Затем в вашем контроллере:

actions: {
    openQuestion: function(questionId) {
        this.$('.answer[data-question-id=' + questionId + ']').toggle('slow');
    }
}

Это предполагает, что вы можете придумать уникальный questionId для каждого вопроса, но это не должно быть слишком сложно.

  • 0
    Спасибо, я думаю, это придется сделать. Я надеялся на способ, не привязанный к идентификатору, потому что сейчас у них нет unqie идентификаторов для каждого вопроса. знак равно
  • 0
    Вероятно, вы можете использовать вычисляемое свойство вместе с функцией guidFor для генерации идентификатора во время выполнения. Таким образом, вам не нужно беспокоиться о постоянных идентификаторах.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню