Question

更新

感谢大家的想法和评论。我认为根据我的项目需求，这里的最佳方法实际上是使用一个不同的框架，这将使我能够更好地控制我需要添加的所有自定义动画。不幸的是，开箱即用，我认为我不能从Angular获得我可以在Backbone.Marionette获得的钩子。另外，我的其他团队成员以前都使用过木偶，所以我觉得它更有意义。

为了更好地解释，因为我的问题实际上没有解决我的主要问题，我需要在我们的页面上的各种元素上进行复杂的动画，因为它们被渲染，并且在它们离开之前。我猜这是可能的Angular，但不是开箱即用，据我所知。不幸的是，我认为我不能再花时间试图让它发挥作用。

此外，为了尝试其他动画技术，我更新了小提琴以使用addClass和removeClass动画。但我似乎无法像我期望的那样让他们开火。 removeClass动画一致地运行，但不是addClass动画。在page1和page2之间切换以触发指向addClass和removeClass的指令。

http://jsfiddle.net/jgS4W/2/

对我来说似乎很奇怪。

更新结束

-

好的，我已经在这里工作了2天但没有成功......我想要做的是在视图中在ng视图容器中渲染时将自定义JS动画添加到视图中。

我已经接近几次了，但每次我都失败了。

我希望我可以使用$ routeChangeSuccess处理程序来访问当前视图的范围并发出'view.enter'事件，但这不起作用。处理程序中的“当前”参数永远不能访问其视图的范围。

我已经创建了一个jsfiddle来解释我在说什么： http://jsfiddle.net/jgS4W/

我认为以下内容可行......

$rootScope.$on('routeChangeSuccess', function (event, current, previous) { current.scope.$emit('view.enter'); ]);

但'current.scope'始终未定义。

我已尝试在ng-view上挂钩动画事件，但它们与ng-view的范围有关，而不是被渲染视图的范围......

我在这里不知所措。如何在呈现视图时发出事件???

谢谢！

Answer 1

您可以尝试这样的事情：

$rootScope.$on( "$routeChangeSuccess", function(event, next, current) {
  $rootScope.$broadcast('view.enter')
});

因为你在$ rootScope中，你应该广播事件，而不是发射。

在您所在的控制器中，您将获得view.enter事件：

$scope.$on('view.enter', function() {
  // Use your event somehow
});

Answer 2

您未获得范围的原因是因为它尚未存在。我已更新了fiddle以证明这一点。

根据您的需要，您可以采用不同的方法并使用父控制器和/或维护某些状态值的共享服务实例，您可以使用它们来制作动画。

似乎stackoverflow在链接到小提琴时强制执行一行代码，所以在这里

// this is a single line of code

Answer 3

检查以下jsfiddle

http://jsfiddle.net/tbbgzfu5/

我已经将'routeChangeSuccess'事件监听器移动到控制器，就像这样，你可以看到找到范围，因为它从控制器获取范围。

这是否解决了您要修复的问题？

myApp.controller('MyController', function ($scope) {
    $scope.something = 'some value'; 
    $scope.$on('$routeChangeSuccess', function (event, current, previous) {
        console.log($scope, 'current.scope');   
    });
});

Angularjs - 如何从$ routeChangeSuccess访问范围？

3 个答案: