0

我正在用角度写一个小线程讨论板。我想将 hallo.js 用于我的内联编辑器（或类似的东西，问题实际上并不取决于 halo）。

这是模板中的相关片段

<div ng-show="post.editing" ng-bind-html="post.body" edit-hallo class="col-xs-8"></div>
<div ng-show="!post.editing" ng-bind-html="post.body" class="col-xs-8"></div>

这是我的指令：

Appl.directive('editHallo', function () {
  return {
    restrict: 'AC',
    scope: true,
    link: function(scope, element, attr) {
      element
        .hallo({
          plugins: {
            'halloformat': {"bold": true, "italic": true, "strikethrough": true, "underline": true},
            'halloheadings': [1,2,3],
            'hallojustify' : {},
          }
        });

      element.bind('hallomodified', function(event, data) {
        scope.post.body = data.content;
      });
    }
  };
});

这一切都很好，但黑客就在最后 - 当有一个 halomodified 事件时，我手动说，scope.post.body = data.content这不仅感觉像一个黑客，这意味着这只有在我有一个 post.body 项目时才有效编辑，因此如果我想将其重新用于配置文件编辑器或其他任何东西，则效果不佳。

所以我的问题是：我应该如何重构它以便相关的双向绑定起作用？我尝试了一些看起来很明显的事情，例如将 aapp-model="post.body"放入 div，然后使用 = 进行隔离作用域，但这并没有让我有任何收获。理想情况下，我会使用 ng-model 指令传入适当的模型，但这似乎在我在网上找到的所有指令示例都被创建和 angular 1.2.0 之间的某个时候发生了变化。

4

1 回答 1

0

有一段时间我不使用 AngularJS。

但我认为最好的方法是将范围更改为：

scope:{ngModel:'='}

或者

scope:{attribute:'='}

这样它应该进行两个数据绑定。在第一种情况下使用 ng-model，或者在第二种情况下使用属性。

然后你可以在事件发生时这样做：

scope.$apply(function(){
    scope.ngModel=newValue;
})

将需要应用，以便 Angular 可以再次调用摘要循环并更新视图。

更多信息，我认为这会有所帮助： http ://docs.angularjs.org/guide/directive

于 2013-10-10T00:55:46.943 回答