AngularJS和主编插件(AngularJS & Redactor Plugin)

所以我工作的一个新的网站在AngularJS，和爱它！

可是，我却遇到了问题。我想添加一个jQuery插件称为“主编”我的文字区域，但我认为正在发生的事情是，当我初始化插件，它取代了textarea元素。究其原因，这是有问题的，是因为我已经把一个“NG-模式”属性的文本区域，如下所示：

我使用AngularJS UI皮卡的焦点事件，然后根据文本的焦点执行以下代码

    $scope.addRedactor = function() {
        $('.redactor').redactor();
    });

现在，我似乎无法得到textarea的价值，因为当我尝试访问NG-模式“响应”，它出现为未定义。

有没有我可以在它已经受到主编的NG-model属性绑定到textarea的一种方式？否则，有另一种方式我应该得到textarea的价值？

Answer 1:

今天我一直在寻找同样的答案，并提出了指导来解决这个问题：

angular.module('Module', []).directive("redactor", function() {
  return {
    require: '?ngModel',
    link: function($scope, elem, attrs, controller) {   

      controller.$render = function() {

        elem.redactor({
          keyupCallback: function() {
            $scope.$apply(controller.$setViewValue(elem.getCode()));
          },
          execCommandCallback: function() {
            $scope.$apply(controller.$setViewValue(elem.getCode()));
          }
        });

        elem.setCode(controller.$viewValue);
      };
    }
  };
});

然后，你可以使用下面的HTML：

<textarea ng-model="yourModel" redactor></textarea>

该模型将在每个使用keyUp被更新，当用户点击工具栏上的按钮。该模型将包含HTML代码。

我刚开始用AngularJS所以请让我知道，如果有更好的方法来做到这一点，或者如果我打破了一些约定，我还是不知道。

Answer 2:

对于那些谁找到公认的答案没有工作，像我一样。这是一个工作（与角V1.1.5）

angular.module('Module', []).directive("redactor", function() {
        return {
            require: '?ngModel',
            link: function($scope, elem, attrs, controller) {
                controller.$render = function() {
                    elem = $(elem);
                    elem.val(controller.$viewValue);
                    elem.redactor({

                        changeCallback: function() {
                            $scope.$apply(controller.$setViewValue(elem.val()));
                        }

                    });

                };
            }
        };
    });

该changeCallback比其他回调结合的方式太多更好，在我的情况，我有向ELEM转换为一个jQuery元素。我还发现，setCode和引用代码是不可用的。可能这是一个不同的版本。