角度和材料设计灯答案

【问题标题】：Angular and Material Design Light角度和材料设计灯
【发布时间】：2015-10-16 09:08:11
【问题描述】：

我正在尝试在一个简单的 Angular 应用程序中实现 MDL。问题是，即使我将 MDL javascript 文件放在 angular javascript 文件之前，依赖 MDL 的 MDL 组件也不起作用。

这是我的脚本顺序：

<script src="js/material.min.js"></script>
<script src="js/jquery.swipebox.min.js"></script>
<!-- load angular, ngRoute, ngAnimate -->
<script src="http://code.angularjs.org/1.2.13/angular.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-route.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-animate.js"></script>
<script src="js/functions.js"></script>

如何让其他 javascript 库使用 angular？

【问题讨论】：

“不工作”的回答有点含糊，你能澄清一下这个问题吗？另外，如果你想要角度和材料设计，为什么不使用第一方angular-material 库呢？ material.angularjs.org
我不想使用 material.angular 因为它对我来说有点复杂。不起作用，因为角度“阻塞”了其他 javascript
这让我们回到了什么不起作用？如果您需要帮助，您的问题需要更详细。元素不渲染吗？您是否收到控制台错误？我看到你有一个 jquery 插件，但你的脚本中没有 jquery 加载，可能是这样，但你必须帮助我们帮助你。
这不是那个 jquery 插件的问题。更具体地说，依赖 mdl 的组件不起作用，就像没有 javascript。例如，抽屉按钮不触发，搜索栏不折叠...
我认为这与我的代码无关，而更像是一个带有自定义 javascript/外部 js 库和 Angular 工作方式的过程。

标签： javascript angularjs angularjs-directive angular-ui-router material-design

【解决方案1】：

我找到了这个并为我工作

angular.module(...)
.run(function($rootScope, $location, $timeout) {
    $rootScope.$on('$viewContentLoaded', function() {
        $timeout(function() {
            componentHandler.upgradeAllRegistered();
        });
    });
})

【讨论】：