Rivets.js: Wenn auf die Schaltfläche geklickt wird, rufen Sie eine Funktion mit einem Argument aus einer Datenbindung

Dies ist so ärgerlich. Es scheint so, als sollte es so einfach sein, aber ich kann die magische Beschwörung nicht finden.Rivets.js: Wenn auf die Schaltfläche geklickt wird, rufen Sie eine Funktion mit einem Argument aus einer Datenbindung

Hier ist der Kern dessen, was ich tun muss:

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

, die zeigen sollten, was ich tun muss. Ich habe viele verschiedene Dinge ausprobiert, aber nichts scheint zu funktionieren.

Quelle

2015-09-21 paulwal222

'rv-on-click = "abc ({Sache})" Einfügen' http://rivetsjs.com/docs/reference/# on- [event] Sie müssen die 2-Wege-Bindung lesen und die Dokumentation der Bindungsbibliothek verwenden. – Pogrindis

Nein. Ich habe das definitiv versucht und es funktioniert nicht. Gibt diesen Fehler: Uncaught TypeError: this.call ist keine Funktion/t.public.handler @ nieten.bundled.min.js: 6/t.Binding.e.eventHandler @ nieten.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

Die einzige funktionierende Lösung, die ich gefunden habe, ist die Verwendung einer Funktion, die ist ein Mitglied von {Sache}, was mir lächerlich vorkommt. Also: 'rv-on-click =" thing.my_function "' – paulwal222

Im Folgenden finden Sie die Standardkonfiguration der Event-Handler von Nieten Website:

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

So abgesehen von dem Ereignisobjekt, können Sie auch einen Verweis auf die auf die spezielle Bindung als zweites Argument im Zusammenhang Modelle bekommen.

mit dem Sie dem jeweiligen Objekt

zugreifen können

Zum Beispiel

<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 :) 
}

Quelle

2015-10-11 12:02:51

funktionierte nicht für mich, – sairfan

@sairfan für dieses Ereignis sollte mit Eventbinder Nieten gebunden werden. Antwort hatte die kopie js Bindung aus Frage eingefügt. Wenn die Nietenbindung nicht funktioniert, teilen Sie bitte eine [mcve] –

Hier ist etwas, wie ich durchgemacht. Kopieren Sie einfach und Arbeitsbeispiele unter

<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>

oder ein alternativer Ansatz Ereignis verbindlich

<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>

Quelle

2017-09-28 16:18:46 sairfan

Dies ist nicht der richtige Weg, es zu tun, es sei denn, etwas in einem Versionsupdate von Nieten brach, in diesem Fall sollten Sie einen Fehler melden, anstatt schlechte Arbeit um –

sollte Ich stoppe mein Projekt, bis ich eine Lösung bekomme ?? Wir müssen aus der Situation herauskommen, wir werden aktualisieren, wenn es in Rivetsjs aktualisiert wird. Dieses Problem ist bereits gemeldet, Lösung wie oben ist auf Rivetsjs Seite diskutiert, Sie haben nicht einmal die Mühe zu verifizieren, was ich zu sagen versuche. – sairfan

Ich habe die Quelle der Nieten vor dem Posten des Kommentars überprüft, und die vorhandene Antwort sollte immer noch mit geringfügiger Änderung der Argumente arbeiten. Die Antwort ist 6 Jahre alt, JS Bibliotheken aktualisieren sich sehr schnell. Die Antwort enthält den Code zum Aufrufen des Ereignishandlers aus der Quelle von Niet zum Zeitpunkt des Schreibens. Es scheint, dass Sie keine Untersuchung durchgeführt haben, warum existierende Lösung nicht funktioniert ... –

Rivets.js: Wenn auf die Schaltfläche geklickt wird, rufen Sie eine Funktion mit einem Argument aus einer Datenbindung

Antwort

Verwandte Themen