在ADVANCED_MODE中将Closure编译器与AngularJS一起使用 [英] Use Closure Compiler with AngularJS in ADVANCED_MODE

问题描述

我正在尝试编译我们的有角& openLayers项目，但我无法使用Angular.

I'm trying to compile one of our angular & openLayers project but I'm not able to use Angular.

我已经输入了角外部参数，但是在编译后出现此错误:

I've put the angular external parameter, but after compiling i get this error :

Error: [$injector:unpr] Unknown provider: aProvider <- a <- myCtrl
http://errors.angularjs.org/1.3.15/$injector/unpr?p0=aProvider%20%3C-%20a%20%3C-%20myCtrl
    at REGEX_STRING_REGEXP (angular.js:63)
    at angular.js:4015
    at Object.getService [as get] (angular.js:4162)
    at angular.js:4020
    at getService (angular.js:4162)
    at Object.invoke (angular.js:4194)
    at $get.extend.instance (angular.js:8493)
    at angular.js:7739
    at forEach (angular.js:331)
    at nodeLinkFn (angular.js:7738)

这是一个简单的例子来说明我的问题:

Here's a simple example to illustrate my problem:

html:

<div ng-app="myApp" ng-controller="myCtrl">
  First Name: <input type="text" ng-model="firstName"><br>
  Last Name: <input type="text" ng-model="lastName"><br>
  <br>
  Full Name: {{firstName + " " + lastName}}
</div>

<script src="angular/angular.js"></script>
<script src="vmap.js"></script>

脚本:

  goog.provide("vmap");

vmap = function(){

};


var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.firstName= "John";
    $scope.lastName= "Doe";
});

要编译文件，请使用以下命令:

To compile the files, I use the command below :

python closure-library/closure/bin/build/closurebuilder.py
--root=closure-library/ 
--root=../debug/ 
--namespace="vmap" 
--output_mode=compiled 
--compiler_jar=compiler.jar 
--compiler_flags="
    --compilation_level=ADVANCED_OPTIMIZATIONS" 
    --compiler_flags="--externs=../debug/lib/angular/angular-1.3.js" 
    --compiler_flags="--angular_pass" > ../vmap.js

我在此处

我想念什么?

推荐答案

1. 在控制器构造函数的jsdocs中添加@ngInject
2. 将函数作为参数传递给角度模块app.controller('myCtrl', fn)
3. 确保将--angular_pass参数传递给闭包编译器.

1. Add @ngInject in jsdocs of the controller constructor function,
2. Pass in the function as an argument to angular module app.controller('myCtrl', fn)
3. Make sure to pass in --angular_pass argument to the closure compiler.

因此，这是所提供示例的修改后的版本，应该对您有用:

So, here is a modified version of the provided example that should work for you:

goog.provide("vmap");

/**
 * @constructor
 * @ngInject
 */
vmap = function($scope) {
    $scope.firstName= "John";
    $scope.lastName= "Doe";
};


var app = angular.module('myApp', []);
app.controller('myCtrl', vmap);

这篇关于在ADVANCED_MODE中将Closure编译器与AngularJS一起使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！