在一个元素中组合两个用于文本操作的指令

Question

修改：此问题的内容为http://plnkr.co/edit/mlKyL1。

我有两个角度指令，它们都转换文本;一个从MarkDown到HTML（参见here），一个来自MathJax（＆＃34; LaTeX＆＃34;）到HTML（参见here）。为简单起见，我们称之为

<div directive1="textCtrl.body"></div>
<div directive2="textCtrl.body"></div>

（此处，textCtrl.body来自输入textarea并实时更新。）

现在，我想将两者结合起来，textCtrl.body首先贯穿directive1，然后通过directive2结果。为实现这一目标，我将textCtrl.body放入模型中并使两个指令都依赖于它。

<div ng-model="textCtrl.body" directive1 directive2></div>

这两个指令看起来大致类似于

app.directive('directive1', function ($compile) {
return {
  require: "ngModel",
  restrict: 'A',
  priority: 10,
  link: function (scope, element, attrs, ngModel) {
    scope.$watch(
      function() {return ngModel.$modelValue;},
      function(modelValue) {
        modelValue += "1"; // do something meaningful here one day
        element.html(modelValue);
      });
  }
};
});

如果priority的{​​{1}} 更低低于directive1的优先级，则首先执行。但是，directive2收到的element内容仍然是原始directive2，而不是modelValue操纵的内容。因此，只有directive1会附加到输出中的2。

关于出了什么问题的任何想法？