何处将jQuery插件插入MEAN.js代码库

时间:2014-10-15 13:56:56

标签: javascript jquery mean-stack

我用MEAN.js开发了几个静态页面。我试图将jQuery Lightbox插件添加到我的项目中。 jQuery Lightbox插件有jQuery.lightbox.js和jQuery.lightbox.css。

你能否告诉我应该把这些文件放在哪里? 我试图放入/ public / dist文件夹,但服务器无法加载js和css文件。

3 个答案:

答案 0 :(得分:4)

您可能需要查看config文件夹下的内容。 config文件夹包含配置应用程序所需的文件。 http://meanjs.org/docs.html#configuration

Css,js和其他资产都在/config/env/all.js中调用

答案 1 :(得分:0)

您需要这样的东西,但如果这些脚本与您的html文件不在同一目录中,则需要重写脚本的URL。当然,如果您使用的是其他版本的jQuery,那么也需要重写该文件名。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="jQuery.lightbox.css" type="text/css">
        <script src="jquery-1.11.0.min.js" type="text/javascript"></script>
        <script src=" jQuery.lightbox.js" type="text/javascript"></script>
        <script type="text/javascript" src="MEAN.js"></script>
    </head>
    <body>

    </body>
</html>

请检查:http://www.w3schools.com/html/html_basic.asp

答案 2 :(得分:0)

您必须在客户端路由中添加:modules /“application-module”/client/config/client.routes.js。请参阅以下代码。

    .state('dashboards.dashboard_2', {
        url: "/dashboard_2",
        templateUrl: "views/dashboard_2.html",
        data: { pageTitle: 'Dashboard 2' },
        resolve: {
            loadPlugin: function ($ocLazyLoad) {
                return $ocLazyLoad.load([
                    {
                        serie: true,
                        name: 'angular-flot',
                        files: [ 'js/plugins/flot/jquery.flot.js', 'js/plugins/flot/jquery.flot.time.js', 'js/plugins/flot/jquery.flot.tooltip.min.js', 'js/plugins/flot/jquery.flot.spline.js', 'js/plugins/flot/jquery.flot.resize.js', 'js/plugins/flot/jquery.flot.pie.js', 'js/plugins/flot/curvedLines.js', 'js/plugins/flot/angular-flot.js' ]
                    },
                    {
                        serie: true,
                        files: ['js/plugins/jvectormap/jquery-jvectormap-2.0.2.min.js', 'js/plugins/jvectormap/jquery-jvectormap-2.0.2.css']
                    },
                    {
                        serie: true,
                        files: ['js/plugins/jvectormap/jquery-jvectormap-world-mill-en.js']
                    },
                    {
                        name: 'ui.checkbox',
                        files: ['js/bootstrap/angular-bootstrap-checkbox.js']
                    }
                ]);
            }
        }
    })