当前位置: 首页 > 面试题库 >

检测是否已为angularjs指令提供了包含内容

颜畅
2023-03-14
问题内容

我有一条指令(进度条),该指令应该有两种可能的状态,一种没有任何描述,一种在左侧带有标签。简单地使用包含在此标签中的内容将很酷。

有谁知道如何根据是否提供了包含内容的内容将类添加到指令中?

所以我想补充:

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

非常感谢!


问题答案:

在发布具有多插槽插入的Angular
v1.5之后,它变得更加简单。例如,您使用component而不是directive并且没有访问linkcompile功能。但是您可以使用$transclude服务。因此,您可以使用“官方”方法检查内容的存在:

app.component('myTransclude', {
  transclude: {
    'slot': '?transcludeSlot'
  },
  controller: function ($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>


 类似资料:
  • 我已经开始学习,我尝试将它与代码一起使用,但是

  • 问题内容: 在以下情况下如何使用包含。目的是在html(部分)文件中使用标记,而不是在模板中(在指令内)定义标记。 我在这里找到了一个很棒的树指令。( 来源)原文: http //jsfiddle.net/n8dPm/ 我没有在指令中定义模板,而是尝试使用包含在内的内容。我还将Angular更新为1.2.0.rc2。更新时间:http://jsfiddle.net/aZx7B/2/ 低于错误 Ty

  • 想知道什么在什么不在吗?Puppet 的 in 可以帮你, 如下面的表达式: if "foo" in $bar 如果 foo 是 $bar 的子串,表达式的值为 true。 如果 $bar 是个数组,并且 foo 是这个数组中的一个元素,表达式的值为 true。 如果 $bar 是一个哈希,foo 是 $bar 的一个键值,表达式的值为 true。 操作步骤 在你的配置清单中添加如下代码: if

  • 本文向大家介绍AngularJS内置指令,包括了AngularJS内置指令的使用技巧和注意事项,需要的朋友参考一下 指令,我将其理解为AngularJS操作HTML element的一种途径。 由于学习AngularJS的第一步就是写内置指令ng-app以指出该节点是应用的根节点,所以指令早已不陌生。 这篇日志简单记录了一些内置指令,先使用起来,再谈一些有趣的东西。 内置指令 所有的内置指令的前缀

  • 问题内容: 我正在寻找下表的CSS选择器: 是否有任何选择器来匹配所有包含“ male”的TD? 问题答案: 如果我正确阅读了说明书,否。 您可以匹配元素,元素中属性的名称以及元素中命名属性的值。不过,我看不到任何与内容匹配的元素。