javascript - 将 Admin LTE 与 Aurelia 结合使用

标签 javascript jquery aurelia adminlte

我有一个 Aurelia CLI 应用程序,并且还使用 npm 安装了 admin-lte。 问题是它无法正确加载。这是因为 Admin LTE 使用 jQuery DOM 就绪事件并期望此时 DOM 中存在内容。 但是,如果我在 app.html 中声明所有布局 html,则不会发生任何事情,因为内容是稍后附加的(我的猜测)。

我创建了一个模拟问题的要点。我想我可以在 app.js 中使用附加的钩子(Hook)并做一些事情,但我不确定做什么。

https://gist.run/?id=e4521c1fb38ec82bffd6a0e4fd8b1da6

如您所见,index.html 中引用了plugin.js,就像我在应用程序中引用Admin LTE javascript 一样。 div 不会改变,因为它是在plugin.js 中的脚本运行后到达的。

这是我真正的应用程序的主体:

<body aurelia-app="main" class="hold-transition skin-blue sidebar-mini">
    <script src="scripts/vendor-bundle.js" data-main="aurelia-bootstrapper"></script>
    <!-- REQUIRED JS SCRIPTS -->

    <!-- jQuery 2.2.3 -->
    <script src="node_modules/admin-lte/plugins/jQuery/jquery-2.2.3.min.js"></script>
    <!-- Bootstrap 3.3.6 -->
    <script src="node_modules/admin-lte/bootstrap/js/bootstrap.min.js"></script>
    <!-- AdminLTE App -->
    <script src="node_modules/admin-lte/dist/js/app.js"></script>
  </body>

我真正需要的是确保 admin-lte/dist/js/app.js 中的 $(function () {...})运行。也许你可以强制 jQuery 重新运行这个函数?

最佳答案

在我的 app.js 中,我可以使用附加函数并调用函数来修复布局:

export class App {
    attached(){
        $.AdminLTE.layout.fix();
    }
}

找到信息here

关于javascript - 将 Admin LTE 与 Aurelia 结合使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39278294/

相关文章:

javascript - 使用单独的 Dropzones 以一种形式上传多个单个文件

javascript - Aurelia 自定义属性,可更改元素内部 HTML

文本框外的iOS 11语义UI文本框模式光标

javascript - 从每个实例都有一个私有(private)闭包的模块导出一个类,但它的原型(prototype)链仍然可以扩展?

javascript - Google map 信息窗口未显示

javascript - 如何在点击时删除多个播放列表项目?

javascript - Aurelia - 在数据绑定(bind)中使用变量作为属性名称

javascript - Angular 2 如何在选项中添加点击事件?

javascript - 如何通过类名将配置应用于文本区域?

javascript - 关于如何更新导航代码以隐藏和显示隐藏的 div 的建议