jQuery没有看到注入AngularJS模板的ngRepeat

时间:2014-08-09 15:37:04

标签: jquery angularjs angularjs-ng-repeat ng-repeat

我是Angular的新手,我刚刚开始将其插入我的工作网站。

我尝试使用this example作为"滚动到视图"用于检测视图中滚动的DOM元素的插件。

当我使用ngRepeat指令插入数据,甚至是本地数据时,jquery插件无法看到加载的数据。仍然看到一个空容器。

我该怎样处理它?<​​/ p>

<div class="row scrolling" ng-repeat="item in projects">
 <span>{{item.name}}</span>
</div>

数据设置为:

$ scope.projects = [...];

控制器内部。

请告诉我jquery函数处理数据的正确方法是什么。

感谢。

1 个答案:

答案 0 :(得分:1)

无论何时使用jQuery,它都应该在一个指令中。

Angular在模型视图和控制器之间进行了拆分,因为它允许您在抽象级别 - 单独的服务中的业务逻辑与DOM操作等之间保持清晰的划分。

通过使用链接函数来触发javascript,放置与DOM交互的代码的适当位置是指令内部。最有可能发生的是您在角度渲染任何组件之前在容器上注册滚动插件,这意味着滚动没有正确触发。现在这意味着每次视图更改时都需要一些触发滚动插件注册的方法。

看到您正在使用ng-repeat,这意味着您的视图将随模型而变化。因此,您可以监听生成ng-repeat的项目数组的更改,并在更改时重新注册包含元素的滚动插件。

您可能需要先取消注册以前的任何滚动插件调用,但基本前提是让您的容器在作为ng-repeat源的数组上使用$scope.$watch进行侦听。

$scope.$watch('projects', function () {
  $container.scrollable()
});

很难给你一个更具体的答案,因为我看不到你在做什么,但希望这可以作为一个指导。了解角度消化系统的工作原理,您对框架的熟悉程度会更高。