require(['jquery', 'px/extensions/bootstrap-markdown'], function($) {
...
});
To use bootstrap-markdown plugin, you need to include the next scripts:
<script src="path/to/js/libs/markdown.js"></script>
<script src="path/to/js/libs/bootstrap-markdown.js"></script>
<script src="path/to/js/pixeladmin/extensions/bootstrap-markdown.js"></script>
<script src="path/to/js/pixeladmin/directives/angular-bootstrap-markdown.js"></script>
Then inject the plugin into your angular application:
angular.module('yourApp', ['bootstrap-markdown']);
Alternatively, you can include bootstrap-markdown plugin using ocLazyLoad plugin:
$ocLazyLoad.load([
{
serie: true,
name: 'bootstrap-markdown',
files: [
'path/to/js/libs/markdown.js',
'path/to/js/libs/bootstrap-markdown.js',
'path/to/js/pixeladmin/extensions/bootstrap-markdown.js',
'path/to/js/pixeladmin/directives/angular-bootstrap-markdown.js',
],
},
]);
markdown-editor
directive
You can use markdown-editor
directive on textarea elements.
And when the scope is destroyed the directive will be destroyed.
bootstrap-markdown's options can be specified as attributes (see the plugin's documentation). All options expect an angular expression instead of a literal string.
<textarea markdown-editor ng-model="text" class="form-control" rows="10"
autofocus="true"
resize="'vertical'"
fullscreen="{enable: false}"></textarea>
Event handlers can be bound using attributes (see the plugin's documentation):
<textarea markdown-editor ng-model="text" class="form-control" rows="10"
on-save="ctrl.save"
on-change="ctrl.change">
function SomeController() {
this.save = function(e) { alert("Saving '" + e.getContent() + "'..."); };
this.change = function(e) { ... };
});