Javascript Impress.js和AngularJS控制器_Javascript_Angularjs_Impress.js

Javascript Impress.js和AngularJS控制器

javascript angularjs

Javascript Impress.js和AngularJS控制器,javascript,angularjs,impress.js,Javascript,Angularjs,Impress.js,我正在运行AngularJS应用程序/控制器。我的目标是在动态加载到我的主页的页面上初始化并使用impress.js库。但是，当我尝试初始化库时，页面不会加载。附件是控制器和html文件的片段注意：当我将impress（）对象打印到控制台时，它不是空的，并且具有所需的功能。我怀疑impress（）对象没有正确连接到页面控制器： 'use strict'; // Create the angular module var cmodule = angular.module('coverage'

我正在运行AngularJS应用程序/控制器。我的目标是在动态加载到我的主页的页面上初始化并使用impress.js库。但是，当我尝试初始化库时，页面不会加载。附件是控制器和html文件的片段

注意：当我将

impress（）

对象打印到控制台时，它不是空的，并且具有所需的功能。我怀疑

impress（）

对象没有正确连接到页面

控制器：

'use strict';

// Create the angular module
var cmodule = angular.module('coverage', ['ngRoute'])

// Create the coverage controller
cmodule.controller('coverageController', function($scope) {

    console.log("Entering controller");
    function require(script) {
        $.ajax({
            url: script,
            dataType: "script",
            async: true,           // <-- This is the key
            success: function () {
                console.log(impress());
                impress().init();
            },
            error: function () {
                throw new Error("Could not load script " + script);
            }
        });
    }

    console.log("About to require");
    angular.element(document).ready(function () {
        require("/content/libraries/impress.js");
            });


    });

“严格使用”；
//创建角度模块
var cmodule=angular.module（'coverage'，['ngRoute']））
//创建覆盖率控制器
cmodule.controller（'coverage controller'，函数（$scope）{
控制台日志（“进入控制器”）；
函数要求（脚本）{
$.ajax({
url:脚本，
数据类型：“脚本”，
async:true，//
准备好看你的报道了吗？
问题从这里开始

这个问题是通过使用jmpress.js库解决的，找到了。

impress（）

不是一个对象，而是一个函数调用。你的意思可能是

impress.init（）

？错误的详细信息可能出现在浏览器的JS控制台中，请在询问之前先使用此信息作为您的第一行支持。很抱歉造成混淆，

impress（）

是一个函数，我的意思是它返回一个对象，该对象具有

init（）

方法。调用

impress.init（）

给出一个错误“

impress.init

不是一个函数。”源代码中概述了这一错误，称“您还需要调用

impress（）.init（）

函数来初始化impress.js演示文稿。”从现在开始…错误是什么？调试器控制台显示了什么？当前调试器控制台没有给出任何错误。My console.log语句都会打印并加载页面，但库不会绑定到id=“impress”正如impress.js源代码中所解释的那样，div就像它被假定的那样运行。因此，一切运行都没有错误，但实际上什么都没有发生。

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=1024" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <title>My Coverage</title>
    <link rel="stylesheet" href="/content/styles/team1.css">
</head>
<body class="impress-not-supported">
    <!--
    For example this fallback message is only visible when there is `impress-not-supported` class on body.
    -->
    <div class="fallback-message">
        <p>Your browser <b>doesn't support the features required</b> by impress.js, so you are presented with a simplified version of this presentation.</p>
        <p>For the best experience please use the latest <b>Chrome</b>, <b>Safari</b> or <b>Firefox</b> browser.</p>
    </div>

    <!-- Now the fun begins -->

    <div id="impress">

        <!-- The background image -->
        <div class="present" data-x="0" data-y="0">
            <!-- Place Image here -->
        </div>

        <!-- Example content -->
        <div id="url-ident" class="step" data-x="0" data-y="0">
            <q>Ready to view your coverage?</q>
        </div>

        <!-- Example content -->
        <div id="step1" class="step" data-x="500" data-y="0">
            <p>Questions start here!</p>
        </div>

    </div> <!-- /div impress -->

    <script type="text/javascript" src="/content/libraries/impress.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <!--script type="text/javascript">impress().init();</script-->

</body>
</html>