检测是否为angularjs指令提供了转录内容

前端之家收集整理的这篇文章主要介绍了检测是否为angularjs指令提供了转录内容前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个指令(进度栏),它应该有两个可能的状态,一个没有任何描述,一个在左边有一个标签
简单地使用该标签的转录内容将是很酷的。

有没有人知道我可以如何添加一个类到我的指令,取决于是否已经给出转录内容

所以我想补充一点:

<div class="progress" ng-class="{withLabel: *CODE GOES HERE*}">
    <div class="label"><span ng-transclude></span>
    <div class="other">...</div>
</div>

非常感谢!

Angular v1.5发布后,多插槽可以更简单。例如,您已使用组件而不是指令,并且没有访问链接或编译功能。然而,您可以访问$ transclude服务。所以你可以使用’官方’方式查看内容的存在:
app.component('myTransclude',{
  transclude: {
    'slot': '?transcludeSlot'
  },controller: ($transclude) {
    this.transcludePresent = function() {
      return $transclude.isSlotFilled('slot');
    };
  }
})

用这样的模板:

<div class="progress" ng-class="{'with-label': withLabel}">
    <div class="label"><span ng-transclude="slot"></span>
    <div class="other">...</div>
</div>

猜你在找的Angularjs相关文章