2015-09-21 1 views
5

Это так бесит. Похоже, это должно быть так просто, но я не могу найти магическое заклинание.Rivets.js: Когда кнопка нажата, вызовите функцию с аргументом из привязки данных.

Вот суть того, что мне нужно сделать:

<div rv-each-thing="data.things"> 
    <input type=button value="Click" onclick="abc({thing})"> 
</div> 

Это должно проиллюстрировать то, что мне нужно сделать. Я пробовал много разных вещей, но ничего не работает.

+0

'с.в.-на-клик = "ABC ({}), что"' http://rivetsjs.com/docs/reference/# on- [event] Вам нужно прочитать, что такое 2-сторонняя привязка, и использовать документацию библиотеки привязки. – Pogrindis

+0

Nope. Я определенно пробовал это, и он не работает. Дает эту ошибку: Непринятый TypeError: this.call не является функцией/t.public.handler @ rivets.bundled.min.js: 6/t.Binding.e.eventHandler @ rivets.bundled.min.js: 6/n .event.dispatch @ jquery-2.1.4.min.js: 3/n.event.add.r.handle @ jquery-2.1.4.min.js: 3 – paulwal222

+0

Единственное работающее решение, которое я нашел, это использование функции, которая является членом {вещи}, что кажется мне смешным. Итак: 'rv-on-click =" thing.my_function "' – paulwal222

ответ

3

Ниже конфигурация по умолчанию обработчика событий с сайта заклепок:

// Augment the event handler of the on-* binder 
handler: function(target, event, binding) { 
    this.call(target, event, binding.view.models) 
} 

Так кроме объекта события, вы можете также получить ссылку на модели, связанные с конкретным связыванием в качестве второго аргумента.

с помощью которых вы можете получить доступ к конкретному объекту

Например

<div rv-each-thing="data.things"> 
    <input type=button value="Click" rv-on-click="abc"> 
</div> 

function abc(event,rivetsBinding){ 
    rivetsBinding.thing //heres your thing :) 
} 
+0

не работал для меня, – sairfan

+0

@sairfan для этого, чтобы работать, событие должно быть связано с связующим событием для заклепок. Ответ имел копию, вставленную js привязкой к вопросу. Если привязка заклепок не работает, сообщите об этом [mcve] –

0

Вот то, как я прошел через это. Просто скопируйте и вставьте рабочие примеры ниже

<body> 
    <div rv-each-book="model.books"> 
     <button rv-on-click="model.selectedBook | args book"> 
      Read the book {book} 
     </button> 
    </div> 
</body> 

<script type="text/javascript"> 
    rivets.formatters["args"] = function (fn) { 
     var args = Array.prototype.slice.call(arguments, 1); 
     return function() { 
      return fn.apply(null, args); 

     }; 
    }; 

    rvBinder = rivets.bind(document.body, { 
     model: { 
      selectedBook: function (book) { 
       alert("Selected book is " + book); 
      }, 
      books: ["Asp.Net", "Javascript"] 
     } 
    }); 
</script> 

Или альтернативный подход является обязательным событием

<body> 
    <div rv-each-book="books"> 
     <a rv-cust-href="book"> 
      Read the book {book} 
     </a> 
    </div> 
</body> 

<script type="text/javascript"> 

    rivets.binders['cust-href'] = function (el, value) { 
     //el.href = '/Books/Find/' + value; 
     //OR 
     el.onclick = function() { alert(value); }; 

    } 

    rvBinder = rivets.bind(document.body, { 
     books: ["Asp.Net", "Javascript"] 
    }); 
</script> 
+0

. Это неправильный способ сделать это, если только что-то не сломало обновление версии заклепок, в этом случае вам следует сообщить об ошибке, а не использовать плохую работу. –

+1

should я останавливаю свой проект, пока не получаю решение? мы должны выходить из ситуации, мы будем обновлять ее, обновляясь в rivetsjs. эта проблема уже сообщается, решение, подобное выше, обсуждается на связанной странице rivetsjs, вы даже не потрудились проверить, что я пытаюсь сказать. – sairfan

+0

Я проверил источник заклепок перед публикацией комментария, а существующий ответ все равно должен работать с незначительными изменениями в аргументах. Ответ 6 лет, JS-библиотеки обновляются очень быстро. Ответ содержит код для вызова обработчика события из источника заклепки на момент написания. Кажется, вы не проводили никаких расследований по поводу того, почему существующее решение не работает ... –

Смежные вопросы