首页 文章

Angular-cli bootstrap v3和jquery? Angular 2.0

提问于
浏览
3

所以我即将开始一个项目,我认为Angular 2.0似乎是一个非常可靠的框架:路由,组件,指令等 . 但是,有很多东西已经使用我想使用的bootstrap v3和jQuery构建 . 我想知道是否可以使用Angular-cli制作的结构集成bootstrap v3和JQuery?

顺便说一句,我已经看过使用Gulp的其他Angular 2种子,但他们总是推荐官方的Angular-cli .

另外,我对如何将现有的JS库打包成Typescript实际工作以及jquery的$ global是否会干扰打字稿也是新的 .

注意:我知道ng2-bootstrap,但我不认为一切都与这种方法兼容,因为它不使用jquery作为依赖 . 我也知道在角度中使用jquery不是最好的做法,但我认为在某些情况下你真的需要它来插件或依赖 .

1 回答

  • 6

    我可以建议你一个解决方法,直到他们得到更好的支持第三方库 . 它对我有用:)

    打字后

    npm install jquery
    

    typings install jquery --ambient --save
    

    在你的angular-cli-build.json中,确保它保持这种方式

    module.exports = function(defaults) {
      return new Angular2App(defaults, {
        vendorNpmFiles: [
          ...
          'jquery/**/*.js'
        ]
      });
    };
    

    并在您的system-config.ts中:

    /** Map relative paths to URLs. */
     const map: any = {
       'jquery': 'vendor/jquery'
     };
    

    在你的src / index.html中添加这一行

    <script src="/vendor/jquery/dist/jquery.min.js" type="text/javascript"></script>
    

    现在在您想要使用jquery的组件中,以这种方式编写

    declare var $:any;
    
    @Component({
    })
    export class YourComponent {
      ngOnInit() {
        $.("button").click(function(){
           // now you can DO, what ever you want 
         });
         console.log();
      }
    }
    

    我这样做,在我的项目中 . 希望它可能会帮助你:) .

相关问题