Javascript 控制AngularJS如何替换ngInclude或自定义指令

我正在学习AngularJS，并注意到AngularJS将插入模板或部分HTML作为Angular元素（如ng include或自定义指令）的子元素。在我的例子中，这破坏了样式设置，因为引导样式不选择作为指令子元素的元素。因此，我认为我要么误解了如何使用指令，要么可能缺乏管理这种行为的术语

例如：

我想只指定我的自定义指令，而不关联特定的HTML类型

输入：

结果:

预期结果：

或

---

是否可以配置ng include或custom指令，以便插入设置本机html类型，而不将部分html作为angular指令的子指令？

您可以使用属性指令而不是元素指令

app.directive('myDropdownMessages', function() {
  return {
    restrict: 'A', // Attribute directive
    templateUrl: 'my-dropdown.html'
  };
});

来自AngularJS文档

什么时候应该使用属性而不是元素？创建控制模板的组件时，请使用元素。常见的情况是，为模板的某些部分创建特定于域的语言。使用新功能装饰现有元素时，请使用属性

对指令使用replace:true

app.directive('myDropdownMessages', function() {
  return {
    restrict: 'A', // Attribute directive
    templateUrl: 'my-dropdown.html'
  };
});

但在极少数需要更换元件的情况下，此属性将很快被删除

---

请参阅

谢谢。我想我越来越近了。刚刚学习了transclude，但结果仍然是原始自定义指令的子指令，而不是替代指令。@MichaelPrescott重点是您可以这样做

<ul class="nav navbar-nav">
  <li my-dropdown-messages class="dropdown my-intended">content</li>
</ul>

<ul class="nav navbar-nav">
  <form my-dropdown-messages class="my-intended">content</form>
</ul>

app.directive('myDropdownMessages', function() {
  return {
    restrict: 'A', // Attribute directive
    templateUrl: 'my-dropdown.html'
  };
});