Angularjs Bbcode 编辑器 [关闭]

Question

我需要一个可以集成到 Angular 应用程序中的简单 BBcode 编辑器。一些非常基本的东西，比如this one。但是我在任何地方都找不到这样的东西。
我发现的最好的东西是 jQuery 的 markItUp plugin，但是当我尝试将它集成到我的应用程序中时，它导致了一些错误：当我按下按钮时绑定模型没有更新，并且它不适用于元素，由角度本身重新创建。

那么，有什么我可以用的吗？
如果没有，我如何将第一个编辑器更改为指令？除了将 html 标记移动到模板之外，我还需要从什么开始？

Answer 1

我最终将 markItUp 与 angular 集成在一起。花了我一段时间，并从 IRC 频道的人那里得到了很多帮助。以下是我的做法。

MarkItUp 指令。

app.directive("markItUp", ["markitupSettings", function(markitupSettings) {
    return {
      restrict: "A",
      scope: {
        ngModel: "="
      },
      link: function(scope, element, attrs) {
        var settings;
        settings = markitupSettings.create(function(event) {
          scope.$apply(function() {
            scope.ngModel = event.textarea.value;
          });
        });
        angular.element(element).markItUp(settings);
      }
    };
  }
]);

这些设置存储在一个服务中，用于在多个实例和控制器之间共享它们。

app.factory('markitupSettings', [
  function() {
    var factory, markset;
    markset = [
      //here goes your usual markItUp layout
    ];
    factory = {};
    factory.create = function(callback) {
      return {
        afterInsert: callback,
        previewParserPath: '',
        markupSet: markset
      };
    };
    return factory;
  }
]);

然后你只需在 html 布局中设置它：

<textarea name="somevar" ng-model="myText" mark-it-up ></textarea>

它已经完成了。您有一个漂亮且功能强大的编辑器。