Impress.js и AngularJS Controller

Я запускаю приложение/контроллер AngularJS. Моя цель - инициализировать и использовать библиотеку impress.js на странице, которая динамически загружается на мою главную домашнюю страницу. Однако, когда я пытаюсь инициализировать библиотеку, страница не загружается. Прикрепленный является фрагментом контроллера и html-файла.Impress.js и AngularJS Controller

ПРИМЕЧАНИЕ. Когда я печатаю объект 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"); 
      }); 


    });

HTML файла:

<!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>

источник

2015-06-18 vontell

'impress()' не объект, а вызов функции. Что вы имели в виду, вероятно, 'impress.init()'? Детали ошибки, вероятно, появились в консоли JS вашего браузера, используйте эту информацию в качестве первой линии поддержки, прежде чем спрашивать о SO. – kryger

Извините за путаницу, 'impress()' является функцией, и я имел в виду, что она возвращает объект, который имеет метод init(). Вызов 'impress.init()' дает ошибку "' impress.init' не является функцией. " Это изложено в исходном коде, говоря: «Вам также нужно вызвать функцию« impress(). Init() », чтобы инициализировать презентацию show.js». от https://github.com/bartaz/impress.js/blob/master/index.html – vontell

Итак ... Какая ошибка? Что показывает консоль отладчика? – kryger

Эта проблема была решена с помощью jmpress.js библиотеки вместо этого, нашли here.

источник

2015-07-05 23:49:13 vontell

Impress.js и AngularJS Controller

ответ

Смежные вопросы