3

我有一个角度应用程序，我正在使用ngQuill

基本指令是通过将其注入您的应用程序并在您的 HTML 中使用标签来实现的：

<ng-quill-editor class="" ng-model="document.doc" toolbar="true" link-tooltip="true" image-tooltip="true" toolbar-entries="font size bold list bullet italic underline strike align color background link image" editor-required="true" required="" error-class="input-error"></ng-quill-editor>

在我的应用程序中，我有一个模式，允许用户选择要从select. 第一次一切都很好。但是，如果我尝试加载不同的文档，ngQuill 会拒绝更新。数据被推送到其他绑定，但不是 ngQuill。我做了一个测试，看看绑定到 ngQuill 的绑定是否真的在获取数据，但ngQuill 永远不会更新。

我想也许它只需要一个 $digest，但我尝试了 $timeout 和 $apply 却什么也没有。这几乎就像它正在失去绑定一样。有什么建议么？

如果您查看此 plunker，您可以看到问题。单击一个按钮，然后单击另一个 - 第一个将正确加载，但之后只有标题更改。

该文档还具有以下内容，但我不确定它是否相关或如何使用它：

如果您在表单中使用它并通过 $setPristine() 重置它 -> 您必须设置 editor.setHTML('') -> 如果模型具有 ng-dirty 类，它将仅添加错误类

4

1 回答 1

0

为了让双向绑定始终如一地工作，我必须link在 ng-quill.js 文件的指令中添加一个 $watch 函数。

基本上，它所做的只是查看我是否更改了视图中附加到指令的 ng-model 绑定，然后将其与编辑器当前存储在指令中的内容进行比较。如果两者不相等，则将内部文档替换为外部文档。

我还添加了一个条件，这样如果我将外部 ng-model 绑定设置为 undefined，它也会清除 ng-quill 文档。

这是功能：

$scope.$watch(function () {
    return ngModel.$viewValue;
  }, 
  function (newText) {
    if (newText && newText !== editor.getHTML()) {
      editor.setHTML(newText);
    }
    if (newText === undefined) {
      editor.setHTML('');
    }
  }
);
于 2015-04-20T11:14:34.440 回答