I currently have the following impedance mismatch: an event handler for a dynamically placed control inside a reusable cshtml component needs to call a function loaded by require().
Is there a way to retrieve a module from require and have my lambda be invoked when it's ready?
<input type='checkbox' @(condition
? "onclick='require(\"js/view/handlers\",
function (handlers) => {
handlers.handleCheckboxMatchingCondition(this);
});
return true;'"
: "")>
Normally the routine is to use id= and match up in the module initializer with addEventListener, but it won't work here because reusable component.
The idea isn't actually to do a new javascript load of a module (the module is loaded at the top of the page) but handle the possible condition of the user clicks the box before the module has finished loading yet.
So it turned out this code was very close to actually being working code. require() would only need a minor tweak to make it work.
<input type='checkbox' onclick="@(condition
? @"return (function(){
let sync = true;
require(['js/view/handlers'],
function (handlers) => {
if (sync)
// It's too hard to make this function work both sync and async
// so we kick it to top level and it's always async
setTimeout(0, handlers.handleCheckboxMatchingCondition, this);
else
handlers.handleCheckboxMatchingCondition(this);
});
sync = false;
return true;});"
: "")>
Feels like something that could go into a trivial wrapper library (that is loaded directly for the obvious reason).