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

发布时间：2020-12-17 08:26:36 所属栏目：安全来源：网络整理

导读：我有一个指令(进度栏)，它应该有两个可能的状态，一个没有任何描述，一个在左边有一个标签。简单地使用该标签的转录内容将是很酷的。有没有人知道我可以如何添加一个类到我的指令，取决于是否已经给出转录内容？所以我想补充一点： div class="progress"

我有一个指令(进度栏)，它应该有两个可能的状态，一个没有任何描述，一个在左边有一个标签。
简单地使用该标签的转录内容将是很酷的。

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

所以我想补充一点：

<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>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!