Grid-A-Licious Grid中的ng-repeat

我正在使用Grid-A-Licious插件（ http://suprb.com/apps/gridalicious/ ）。

我的标记如下：

Properties Around you
 
 
 
 
  
   
{{m.title}}
 
 
 
 Bath : 2 Beds : 2 Pool : 2 $380,000 
 
 See Detail Compare 
 
 
 
 
 
  

正如你在网格中看到的那样，我有一个绑定到我的视图模型的ng-repeat属性。

我遇到的问题是，Grid-A-Licious需要在document.ready（）上运行以下代码：

 $(".grid-item").gridalicious({ width: 250, gutter: 10, animate: true, effect: 'fadeInOnAppear' }); $(".grid-galeries").gridalicious({ width: 240, gutter: 10, animate: true, effect: 'fadeInOnAppear' }); 

我遇到的问题是我的网格内容绑定到我的视图模型，并将根据其他条件动态更改（它实际上是服务调用的结果）。 这导致网格外观错误。

有什么办法，我可以调用上面的选择器，每次grid属性绑定的模型属性都会发生变化吗？ 这样做是否完全违背angularJS惯例？

提前谢谢了

Answer 1

您可以使用watch来实现目标。 但请注意，这应该在Directive处理而不是在控制器中处理，但为了使这个答案变得简短（更直接），我将使用控制器示例：

 app.controller('myCtrl',['$scope',function($scope){ "use strict"; $scope.map.dynamicMarkers= [{ /*some object we do not know*/ }]; $scope.$watch("map.dynamicMarkers",function(newValue, oldValue, scope){ $(".grid-item").gridalicious({ width: 250, gutter: 10, animate: true, effect: 'fadeInOnAppear' }); $(".grid-galeries").gridalicious({ width: 240, gutter: 10, animate: true, effect: 'fadeInOnAppear' }); },true); }]); 

免责声明：不推荐从控制器修改视图，也不建议使用“角度方式”。 我认为这些行动应该转移到指令中。