0

在说首先触发了一些动画之后，有没有办法从控制器中手动加载视图？我的场景是上一页内容向上滑动，之后视图将在屏幕外并且一旦准备好时更新 - 使用新控制器的新视图向下滑动。

我已经设置了路由器，但只要调用新控制器，它就会立即替换视图。

如果可能的话，请提供任何小提琴？

4

2 回答 2

0

Controller 中的代码不应该操纵 DOM，指令应该。这是防止使用“src”（通过浏览器的解析器）预加载元素内容的指令，并且仅在加载之后显示元素内容，并且在加载之前使用微调器显示启动：

directive('onloadSrc', function($compile) {
 return function(scope, element, attrs) {
  element.bind('load', function() {
    var parent = $compile(element[0].parentElement)(scope);
    if (!element.attr('src') && attrs.onloadSrc) {
      element.attr("src", attrs.onloadSrc);
      // replace this dirty hardcode with your template for splash spinner                                          
      var spinner_div = $compile('<div style="z-index: 100; width: '+element.attr('width')+'px; height: '+element.attr('height')+'px; display:block; vertical-align:middle;"><img src="/img/spinner.gif" style="position: absolute; left: 50%; top: 50%; margin: -8px 0 0 -8px;"/></div>')(scope);
      attrs.onloadSrc = "";
      parent.prepend(spinner_div);
      element.css("display", 'none');
      attrs.xloading = spinner_div;
    }
    else {
     if (attrs.xloading) {
      attrs.xloading.remove();
      attrs.xloading = false;
      element.css("display", 'block');
    }
   }
 }
);
}});

src要使用此指令，请保留元素的空属性并填充属性onload-src。

于 2013-07-31T11:12:08.920 回答
0

Angular 在不稳定的分支中内置了动画，这应该完全适合您的场景。只需查看http://www.nganimate.org/angularjs/tutorial/how-to-make-animations-with-angularjs。 ng-view指令内置了“进入”和“离开”动画。检查你这个样本： http: //jsfiddle.net/nFhX8/18/它做的更少你想要实现的。

于 2013-07-31T11:46:47.463 回答