Name | Cost | Profit | Fun |
---|---|---|---|
Car | 100 | 200 | 0 |
Bike | 330 | 240 | 1 |
Plane | 430 | 540 | 3 |
Yacht | 100 | 200 | 0 |
Segway | 330 | 240 | 1 |
TOTAL | 1290 | 1420 | 5 |
require(['jquery', 'px-libs/mindmup-editabletable'], function($) {
...
});
To use editable-table plugin, you need to include the next scripts:
<script src="path/to/js/pixeladmin/directives/angular-editable-table.js"></script>
Then inject the plugin into your angular application:
angular.module('yourApp', ['angular-editable-table']);
Alternatively, you can include editable-table plugin using ocLazyLoad plugin:
$ocLazyLoad.load([
{
name: 'angular-editable-table',
files: [
'path/to/js/pixeladmin/directives/angular-editable-table.js',
],
},
]);
editable-table
directive
You can use editable-table
directive on tables.
And when the scope is destroyed the directive will be destroyed.
Name | Cost | Profit | Fun |
---|---|---|---|
Car | 100 | 200 | 0 |
Bike | 330 | 240 | 1 |
Plane | 430 | 540 | 3 |
editable-table's options can be specified as attributes (see the plugin's documentation). All options expect an angular expression instead of a literal string.
<table editable-table class="table"
clone-properties="['text-align', 'font', 'font-size']">
...
</table>
Event handlers can be bound using attributes (see the plugin's documentation):
<table editable-table class="table"
on-change="ctrl.change"
on-validate="ctrl.validate">
...
</table>
function SomeController() {
this.change = function(e, newValue) { ... };
this.validate = function(e, newValue) { ... };
});