清理来自 textangular 的文本输入答案

【问题标题】：sanitize text input from textangular清理来自 textangular 的文本输入
【发布时间】：2014-09-18 08:07:56
【问题描述】：

我正在使用 textangular 作为我正在从事的项目的富文本解决方案。

需要清理此输入，因为我们只允许某些 html 标签。

由于这不是 textangular 的默认可能性，我创建了一个包含 textangular 指令的指令。我可以成功地清理输入文本，但视图永远不会更新，我已经没有想法如何实现这一点

指令：

.directive('chTextAngular',  function(){

    return {
      restrict: 'E',
      require: 'ngModel',
      template: function(elements, attributes) {
        return '<div text-angular ng-model="' + attributes.ngModel + '" id="' + attributes.id + '"></div>';
      },
      link: function(scope, element, attributes, ngModel) {
        scope.$watch(attributes.ngModel, function(n, o) {
          if(n !== undefined) {

            // Replace all the divs with <br> tags
            var sanitized = ngModel.$viewValue.replace(/<div>/gm, '<br>').replace(/<\/div>/gm, ' ');
            sanitized = sanitized.replace(/<p>/gm, '').replace(/<\/p>/gm, '<br><br>');

            sanitized = $.htmlClean(sanitized, {
              allowedTags: ["strong", "em", "ul", "ol", "li", "a", "b", "i", "br"],
              allowedAttributes: ["a", "href"]
            });

            console.log(sanitized);

            ngModel.$setViewValue(sanitized);

          }
        });
      }
    }
});

日志打印出模型，它表明它实际上是变化的。我只是不知道如何在 textangular 中更新实际的 textarea。

谁能帮我解决这个问题，或者把我引向正确的方向？

【问题讨论】：

我讨厌评论旧帖子，但您有没有设法解决这个问题？我有同样的问题，在遵循@Simeon Cheeseman 的指示后，我仍然无法让它工作。两种方法（updateTaBindtaTextElement 和 refreshEditor）都被调用，但视图仍未更新。

标签： angularjs angular-directive

【解决方案1】：

好的，我要问的第一个问题是；你真的需要更新视图吗，或者如果模型是正确的数据，它可以正常吗？

其次，您可能应该通过ngModel.$parsers.push(function(n,o){...}) 注册您的函数以避免额外的观察者。

它不更新的原因是我们在 textAngular 中有一个陷阱，以防止模型在有人打字时更新视图。如果您在字段集中时执行此操作，那么您会遇到光标移回文本字段的开头/结尾的问题。如果您确实想从模型更新视图，则注册一个模糊事件处理程序 (element.on('blur', ...);) 并调用 scope.updateTaBindtaTextElement() 可能会起作用，具体取决于您的指令附加到的范围。如果该功能不起作用，您必须在 textAngular 元素中添加一个 name 属性，然后使用 textAngularManager.refreshEditor(name); 功能。

【讨论】：