javascript - 使用 ngAnimate 的 ngDocs 示例

Question

我正在使用 grunt-ngDocs 生成我的 API 文档.我在使用包含使用 ngAnimate 的动画的示例时遇到问题。我在脚本选项中包含了 angular-animate 脚本(根据 ngdocs 的要求)，当我浏览生成的文档时，我看到了动画。

这是我的示例代码

/** 
 * @ngdoc directive
 * (other of ng-doc options)
 *
 * @example
 <example module="exampleAnimationModule"> 
   <file name="index.html">
     <div class="box" my-animation>Click Me</div>
   </file> 

   <file name="styles.css">
     .box {
       border: 1px solid black;
       height: 100px;
       width: 100px;
      }
     .box.red {
       background-color: red;
     }
   </file>

   <file name="script.js">
     angular.module('exampleAnimationModule', ['ngAnimate'])
     .directive('myAnimation', function($animate){
       return {
         link: function(scope, element, attrs, fn) {
           element.on('click', function(){
             scope.$apply(function(){
               $animate.addClass(element, 'red');
             });
          });
         }
       };
     });
   </file>     
 </example>
 */

当我查看文档时，演示可以正确呈现，但是当我单击该框时没有任何反应。但是，当我单击启动 $digest 循环的文档中的其他内容时，会出现动画。

这几乎就像 scope.$apply() 没有正常工作一样。更有趣的是，当我单击“在 Plnkr 中查看”链接时，一切都按预期进行。

Answer 1

终于在ngdocs源码中找到了答案。 <example> 上有一个可选的动画属性可以设置为 true 的标签。当它打开时，它会在屏幕上呈现一个正常工作的“动画开/关”按钮。

<example module="exampleAnimationModule" animations="true"> 

我在文档中的任何地方都找不到这个选项。我在 this regex 中找到了它