适用于AngularJS的最佳轻量级非html WYSIWYG

时间:2016-07-16 07:51:41

标签: javascript angularjs wysiwyg

几天以来,我正在寻找一种非html(降价,bbcode)WYSIWYG,对于某种论坛来说真的很简约。

我只需要允许用户以非HTML格式添加链接,粗体斜体和断行。 但我所能找到的只是一些肮脏的老wysiwyg功能太多而且没有angularjs的指令或只是html wysiwyg ..

你有什么建议吗?

此时我想我应该自己做。

提前感谢您的回复。

1 个答案:

答案 0 :(得分:0)

看看AngularJs中实现的example;您可以根据需要自定义并将其转换为Angular模块;

示例

angular.module("myApp", [])
    .directive("click", function () {
        return {
            restrict: "A",
            link: function (scope, element, attrs) {
                element.bind("click", function () {
                    scope.$evalAsync(attrs.click);
                });
            }
        };
    })
    .controller("Example", function ($scope) {
        $scope.supported = function (cmd) {
            var css = !!document.queryCommandSupported(cmd.cmd) ? "btn-succes" : "btn-error"
            return css
        };
        $scope.icon = function (cmd) {
            return (typeof cmd.icon !== "undefined") ? "fa fa-" + cmd.icon : "";
        };
        $scope.doCommand = function (cmd) {
            if ($scope.supported(cmd) === "btn-error") {
                alert("execCommand(“" + cmd.cmd + "”)\nis not supported in your browser");
                return;
            }
            val = (typeof cmd.val !== "undefined") ? prompt("Value for " + cmd.cmd + "?", cmd.val) : "";
            document.execCommand(cmd.cmd, false, (cmd.val || ""));
        }
        $scope.commands = commands;
        $scope.tags = [
    'Bootstrap', 'AngularJS', 'execCommand'
  ]
    })