javascript - 包含示例不适合我

Question

我一直在寻找this tutorial ，现在我正在尝试遵循它。但不知何故，当我到达以下 JSBin 并将其全部粘贴到我的测试文件夹中时，它就无法工作:

http://teropa.info/blog/2015/06/09/transclusion.html

您可以在右侧看到卡片完美显示。好吧，当我复制粘贴此代码时，内容不会在模板的“内容”div 内呈现，这意味着嵌入根本不起作用。

可能会发生什么？代码粘贴得很完美，无论是HTML、CSS还是JS。甚至尝试过我的本地版本的 Angular(最后一个)。

但内容一直被隐藏!有什么帮助吗？我真的很想了解嵌入是如何工作的。

Answer 1

假设我创建了一个名为 myDirective 的指令作为元素

<div ng-controller="myCtrl">
   <my-directive>
      <button>some button</button>
      <a href="#">and a link</a>
   </my-directive>
</div>

myDirective 有一个使用 transclude 的模板

myApp.directive('myDirective', function(){
   return{
     restrict: 'E',
     transclude: true,
     template: '<div class="something" ng-transclude> my directive goes here...</div>'
  }
});

它将把 DOM 渲染为

<div class="something"> 
   my directive goes here...
   <button>some button</button>
   <a href="#">and a link</a>
</div>.