Q&A
MonacaでAngularJSを用いたアプリ開発をしております。
今回ngCookieが必要でしたので、「JS/CSSコンポーネントの追加と削除」から、angular-cookiesをプロジェクトに追加しました。
その後メインのJavascriptファイルであるapp.jsの冒頭部、angular.module()の第二引数の配列に ngCookies を以下のように増やしました。
javascript
1var app = angular.module('myapp', ['onsen.directives', 'ngCookies']);
プレビューで確認してみると、
Uncaught Error: [$injector:modulerr] Failed to instantiate module myapp due to: Error: [$injector:modulerr] Failed to instantiate module ngCookies due to: Error: [$injector:nomod] Module 'ngCookies' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
というエラーが起き、アプリ画面の上部（<ons-toolbar>の部分）のみが表示され、ほぼそれ以外のOnsen UIの部品がまったく表示されなくなってしまいました。
いろいろと調べたのですが、私と同じ条件でエラーが出ているパターンが無く、解決できませんでした。
angular.module() の第二引数の配列が 'onsen.directives' のみの場合はOnsen UIの部品が正しく表示されますが、このままでは ngCookies を使うことができません。。
この現象は ngCookies に限らず、ほかのモジュールでも同様でした。
ons.bootstrap() や angular.module() まわりで何かしらの問題があるものと考えております。
AngularJSによるアプリ開発にまだ慣れておらず、的外れな質問でしたら申し訳ありません。よろしくお願いします。
index.htmlとapp.jsの冒頭部を示します。
index.html
HTML
1<!DOCTYPE HTML> 2<html lang="ja" ng-app="barrierFreeNav"> 3<head> 4 <meta charset="utf-8"> 5 <script src="components/loader.js"></script> 6 <link rel="stylesheet" href="components/loader.css"> 7 <link rel="stylesheet" href="css/style.css"> 8 <script> 9 ons.bootstrap(); 10 </script> 11</head> 12<body> 13 <ons-navigator var="myNavigator" page="login.html"> 14 </ons-navigator> 15 <script src="js/app.js"></script> 16</body> 17</html>
app.js
javascript
1(function() { 2 var app = angular.module('myapp', ['onsen.directives', 'ngCookies']); 3 4 app.factory(... 5 app.controller(...
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。