Javascript 构建角度模块形成jQuery插件

大家好，先谢谢大家

我面临的任务是转换HTML和jQuery密集型网站，并使其与AngularJs一起工作。问题是它有很多插件，比如

http://adnantopal.github.io/slimmenu

https://github.com/inuyaksa/jquery.nicescroll

http://tympanus.net/codrops/2012/08/02/animated-responsive-image-grid/

https://dev7studios.com/dropit/

http://fitvidsjs.com/

它们在

HTML

页面上加载如下 问题 这些插件只有在页面是静态的情况下才能工作，当我将它们与AngularJs一起使用时，它们就不工作了。我会遇到类似

gridrotator未定义的错误

问题: 如何使和其他库成为可用于Angular的模块

我想做的

---

但是现在我是否将原始库代码放在Angular中的工厂或服务提供者上？

DOM操作应该在指令中完成，而不是在服务或控制器中完成。更多详情请参见。谢谢@Lex这是一个很好的参考，我不敢相信我错过了它。也许我太雄心勃勃了，因为我想使用DOM操作应该在指令中完成，而不是在服务或控制器中。更多详情请参见。谢谢@Lex这是一个很好的参考，我不敢相信我错过了它。也许我太雄心勃勃了，因为我想用

```
<script src="js/slimmenu.js"></script>
<script src="js/jquery.nicescroll.js"></script>
<script src="js/gridrotator.js"></script>
<script src="js/js/ionrangeslider.js"></script>
other scripts
```

````
// main.js

$(document).ready(function(){
  $('html').niceScroll({
      cursorcolor: "#000",
      cursorborder: "0px solid #fff",
      railpadding: {
        top: 0,
        right: 0,
        left: 0,
        bottom: 0
      },
      ....etc
  });
 owlCarouselSlider.owlCarousel({/*--code--*/});
});

$('div.bg-parallax').each(function(){/*//code*/});

$('input.time-pick').timepicker({
  minuteStep: 15,
  showInpunts: false
})

$('.form-group-cc-number input').payment('formatCardNumber');

$(function() {
  $('#ri-grid').gridrotator({})
});

````