require(['jquery', 'px-libs/jquery.bootstrap-touchspin'], function($) {
...
});
To use bootstrap-touchspin plugin, you need to include the next scripts:
<script src="path/to/js/libs/jquery.bootstrap-touchspin.js"></script>
<script src="path/to/js/pixeladmin/directives/angular-touchspin.js"></script>
Then inject the plugin into your angular application:
angular.module('yourApp', ['angular-touchspin']);
Alternatively, you can include bootstrap-touchspin plugin using ocLazyLoad plugin:
$ocLazyLoad.load([
{
name: 'angular-touchspin',
files: [
'path/to/js/libs/jquery.bootstrap-touchspin.js',
'path/to/js/pixeladmin/directives/angular-touchspin.js',
],
},
]);
touch-spin
directive
You can use touch-spin
directive on input elements.
And when the scope is destroyed the directive will be destroyed.
bootstrap-touchspin's options can be specified as attributes (see the plugin's documentation). All options expect an angular expression instead of a literal string.
<input touch-spin type="text" class="form-control"
forcestepdivisibility="'floor'"
step="5"
verticalbuttons="true"
buttonup_class="'btn btn-primary'">
Event handlers can be bound using attributes (see the plugin's documentation):
<input touch-spin type="text" class="form-control"
on-startspin="ctrl.startspin"
on-min="ctrl.min"
on-stopdownspin="ctrl.stopdownspin">
function SomeController() {
this.startspin = function() { ... }
this.min = function() { ... }
this.stopdownspin = function() { ... }
});