多个指令改变单个元素的html

Question

我有两个指令都放在一个div上。但只有第一个指令的内容放在div中。是否有可能让2个指令改变这个div的html？

-HTML
<div messages messageControls/>

-Messages Directive
(function() {
  "use strict";
  define(function() {
    messages = [
      function() {
        return {
          priority: 1,
          restrict: 'A',
          templateUrl: '../../messages.html',   (<p>hello world</p>)
          scope: {

          },
          link: function(scope) {}
        };
      }
    ];
    return messages;
  });

}).call(this);




-MessageControls Directive
(function() {
  "use strict";
  define(function() {
    messageControls = [
      function() {
        return {
          priority: 2,
          restrict: 'A',
          templateUrl: '../../messageControls.html',   (<p>delete message</p>)
          scope: {

          },
          link: function(scope) {}
        };
      }
    ];
    return messageControls;
  });

}).call(this);

当我只添加一个指令时，它可以工作。但是当我添加第二个时，我得到以下角度误差：“多个指令要求模板打开