私はPlay Framework（2.5.9）を使用しています。私のスカラーhtmlテンプレートでは、WebJars経由でAngularをプルします。次に、自分のページに使用したいモジュールとコントローラを指定します。しかし、ページを読み込もうとすると、AbstractACtrlを使って "hi"に設定する必要のある変数が設定されていません。また、私は、ブラウザのコンソールで次のエラーを取得する：Playで使用されるAngularJsがモジュールを見つけたりインスタンス化できません
Error: [$injector:modulerr] Failed to instantiate module abstractA due to:
[$injector:nomod] Module 'abstractA' 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.
モジュール「abstractAは」利用できない理由を私は理解していません。私はview.scala.htmlページでそれを定義しています... Chromeでは、ソースにwebjars/angular.js/1.5.9/angular.jsが表示されているため、angular.jsが引き込まれていることは間違いありません。以下のコードのconsole.logとconsole.errorは、デバッグのためにコンソールに出力しているメッセージだけです。実際にコンソールには何も印刷されておらず、実行が決してそれらに届かないことを示しています。私が試した
もの：
1 WebJarsなしで直接angular.js中）ロード（）。
2）WebJarsの有無にかかわらず、angle-route.js、angular-resource.js、および/またはangular-animate.jsをプルします。
3） "data-ng-app" - "ng-app"または "x-ng-app"のいずれかにします。
4）を介してコントローラと、基準に$スコープ内のすべてのフィールドを渡す「$スコープ。」...の代わりに「これ。」...
5）の冒頭で、「VaRのabstractA」を作ります私のJavaScriptは "var ab"です。
6） "body"部分の代わりに "head"部分に角度をつけてスクリプトを配置します。
7）「this.originalAs = @aDocs;」を削除します。コントローラからのライン。
8）すべてのjavascriptをページの「先頭」部分に配置します。
以下は私の現在のコードです。モジュール "abstractA"が利用できない理由を教えてください。
build.sbt：
libraryDependencies ++= Seq(
...
"org.webjars" % "angularjs" % "1.5.9",
"org.webjars" % "angular-ui-bootstrap" % "2.2.0",
"org.webjars" % "bootstrap" % "3.3.7-1",
"org.webjars" %% "webjars-play" % "2.5.0"
)
view.scala.html：
@(aDocs: List[String],
webJarAssets: controllers.WebJarAssets)
<!DOCTYPE html>
<meta charset='utf-8'/>
<html lang='en'>
<head>
<link rel='stylesheet' href='@routes.WebJarAssets.at(webJarAssets.locate("css/bootstrap.min.css"))' />
<link rel='stylesheet' type='text/css' href='@routes.Assets.versioned("assets/stylesheets/style.css")' />
</head>
<body>
<script type='text/javascript' src='@routes.WebJarAssets.at(webJarAssets.locate("angular.js"))' />
<script type="text/javascript">
var abstractA = {};
abstractA.module = angular.module('abstractA', []);
abstractA.module.controller('abstractACtrl', ['$http', AbstractACtrl]);
function AbstractACtrl($http) {
var controller = this;
this.name = "Abstract A Controller";
this.abc = "hi";
console.log("log beginning of controller");
console.error("error beginning of controller");
this.originalAs = @aDocs;
this.setUrl = function() {
console.error("error in setUrl");
console.log("log in setUrl");
};
}
</script>
<div data-ng-app='abstractA' x-ng-controller='AbstractACtrl as abstractACtrl'>
...
<div ng-repeat="originalA in abstractACtrl.originalAs">
<p>{{originalA}}</p>
</div>
<p>{{abstractACtrl.abc}}</p>
<p>{{abc}}</p>
<button ng-click='abstractACtrl.setUrl()'>Click!</button>
</div>
</body>
</html>