<!-- HTML anywhere -->

<div data-atv-controller="hello">
  <input data-atv-hello-target="name" type="text">

  <button data-atv-action="click->hello#greet">
    Greet
  </button>

  <span data-atv-hello-target="output">
  </span>
</div>      
      

// app/javascripts/controllers/hello_atv.js

function connect (targets) {
  return {
    greet: function () {
      targets.output.textContent = 
        `Hello, ${targets.name.value}!`;
    }
  };
}

export { connect };
      

ATV is working to provide the same functionality as Stimulus.js, but with a cleaner way of writing your controllers.

See more examples.

If you are interested in helping the effort please join the discussion board on Github.

Brought to you by sbrew.com.