AngularJS .ng-enter 动画在第一次运行时不起作用答案

【问题标题】：AngularJS .ng-enter animation doesn't work on first runAngularJS .ng-enter 动画在第一次运行时不起作用
【发布时间】：2014-04-23 08:28:58
【问题描述】：

我的 AngularJS 应用程序有一个奇怪的问题；使用 ng-include 切换我的选项卡幻灯片中的动画，第一次不起作用，但在第二次或第三次时效果很好。

这是我在 plunker 上的测试代码：http://embed.plnkr.co/a2x4vkTVgEUEt9mxWaVy/preview

看起来像 ng-enter 动画类，设置之前，模板上传。请帮忙。

【问题讨论】：

标签： javascript angularjs angularjs-animation

【解决方案1】：

动画似乎无法正常工作，因为您的模板加载不正常。我建议要么使用指令来实现选项卡，要么使用 ngRoute。

我在这里用 ngRoute 做了一个例子： http://embed.plnkr.co/RFw3CZwQmPz9doqe7o1u/preview

我不完全确定您的应用应该做什么，所以我可能破坏了您的初始设置。但我看到你使用了很多 rootScope。我建议使用服务来存储控制器之间的共享数据。像这样（使用此处的示例：Passing data between controllers in Angular JS?）

app.service('productService', function() {
  var productList = [];

  addProduct = function(newObj) {
      productList.push(newObj);
  };
  getProducts = function(){
      return productList;
  };
});

更新： 可以在$routeProvider、like this 中使用动态templateUrls。这也可以通过控制器实现。这样您就不必为每个步骤指定单独的路线。

【讨论】：

谢谢你的回答。我的模块是一个非常大的表格，11 个步骤，约 200 个字段，并且全部用于一个对象“实验室”，所以我不想使用任何服务和路线。但你绝对是对的，如果可以的话，最好使用服务和路线！ :)
啊，好的，可以理解。我更新了我的答案。
谢谢，再次！但在我的情况下，路由会出现更多问题:) 我找到了 $templateCache 的解决方案。现在模板在启动时加载到应用程序，而用户填写第一步字段:)
是的，我看到了，只是想我可以把它放在那里以防其他人来看:)

【解决方案2】：

好的，我找到了我自己的问题的解决方案，如果你有同样的问题，你必须使用 $templateCache 服务，这里是 plunker 上的代码： http://embed.plnkr.co/mnB6VwXqHSt6L3IEUvCI/preview

【讨论】：