AngularJS and Play-Bootstrap: How to include a ng-click within @b3.submit?

Question

I'm using Scala-Play 2.5.10, Play-Bootstrap and AngularJS 1.x and I need one form submission to be handled from AngularJS. I then tried:

@b3.submit('class -> "btn btn-danger", 
           'ng-click -> "runInSampleSimulation()") { 
                <span class="glyphicon glyphicon-cog"></span> Run Simulation 
}

but the ng-click isn't recognized. I was hoping that it would be simply passed through into a Map as key-value pairs i.e. <button type="@buttonType" @toHtmlArgs(innerArgsMap)>@text</button> see here.

So I'd be left only with the choice of falling back to plan HTML like this:

<button type="submit" class="btn btn-danger" ng-click="runInSampleSimulation()">
    <span class="glyphicon glyphicon-cog"></span> Run Simulation
</button>

Is there a way to hook in the ng-click to the b3?

Answer 1

I decided to achieve this through changing the form instead of the submit button and using ng-submit.

Apparently there was no solution out-of-the-box. Although what I was hoping for was true that the Symbols are pass through, for some reason the dash - is an illegal Symbol for the templates. Therefore this would give an error:

@b3.form(routes.Simulation.computeInSample, 'ng-submit -> "runInSampleSimulation()") {

So I took the form template and modified into a custom b3/ngform.scala.html like this:

@(action: Call, args: (Symbol, Any)*)(body: => Html)(implicit fc: b3.B3FieldConstructor)
<form method="@action.method" ng-submit="@bs.Args.get(args, 'ngsubmit)&#40;'@action.toString'&#41;"
      class="@fc.formClass @bs.Args.get(args, 'class)"
      @toHtmlArgs(bs.Args.remove(bs.Args.remove(bs.Args.inner(args, 'role -> "form"), 'ngsubmit), 'class).toMap)>
@body
</form>

Which I can then use like this:

@b3.ngform(routes.Simulation.computeInSample, 'ngsubmit -> "runInSampleSimulation") {

and generates exactly what I had wanted:

<form class="form-horizontal ng-pristine ng-valid" 
      role="form" method="GET" ng-submit="runInSampleSimulation('/simulation/in/')">