Question

嗨我在角度完成渲染后陷入了运行js脚本的困境。我从https://github.com/codrops/AnimatedHeader

克隆了代码

我需要它在html渲染之后运行，因为它需要header元素，但是因为我正在开发一个angularJs应用程序，它需要一些时间来渲染，所以我的脚本先渲染并给我错误。所以我有办法让它等待。

我已经尝试过使用自定义指令，使用ng-cloak，将我的js放在window.onload中。我尝试了很多解决方案，但没有一个适合我。

这是我的index.html：

<html lang="en" ng-app="pliro" ng-cloak="">
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.2/angular-animate.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap-tpls.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.8/angular-ui-router.min.js"></script>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css
    </head>
    <body id="page-top" class="index">
        <script src="scripts/main/main.js"></script>
        <script src="scripts/main/main-controller.js"></script>
        <script src="scripts/header/header-controller.js"></script>
        <script src="scripts/footer/footer-controller.js"></script>
        </script>
        <div ng-include="'scripts/header/header.html'"></div>
        <div ui-view></div>
        <div ng-include="'scripts/footer/footer.html'"></div>
    </body>

    <script ng-src="js/classie.js"></script>
    <script ng-src="js/cbpAnimatedHeader.js"></script>
</html>

我需要在header.html渲染后运行classie.js和cbpAnimatedHeader.js。非常感谢任何帮助。

Answer 1

那两个js不到100行。我建议你把它重新写入指令或服务。他们不会花一天多时间为你服务。

或

在身体末端加载所有js。如果已加载“header.html”，则添加<script>循环检查，然后本地加载其他js。我相信这比选项要复杂得多。

完成角度渲染后运行js脚本

1 个答案: