[英]How to access variable calculated in other js file?
Just a simple example make it clear: In this example how can I use the calculated machineLength in angularApp.js? 只是一个简单的例子就清楚了:在这个例子中,如何在angularApp.js中使用计算出的machineLength? For now, it output an empty object, not the calculated in the angularApp.js.
现在,它输出一个空对象,而不是angularApp.js中计算的对象。
<html>
<head>
<script src="...">...</script>
<script>
let machineLength={};
</script>
<script src="angularApp.js"></script>
</head>
<body>
...
<script>
console.log(machineLength);
// here is a lot of code use machineLength to render scene of models with three.js
//the machineLength is the render region width, height. length
</script>
</body>
</html>
angularApp.js: angularApp.js:
let sliceApp = angular.module('sliceConfig', []);
sliceApp.
.controller('sliceConfigController', ['$scope', '$http', function($scope, $http)
{
$http.get("http://xxxxx/getSliceConfig")
.success(function(response)
{
$scope.config = [];
$scope.config.machine_width = machineLength.x = parseFloat(response.config.machine_width);
...
}
}]);
Any helps will be appreciated! 任何帮助将不胜感激!
You need to use Providers value recipe 您需要使用提供者的价值配方
var myApp = angular.module('myApp', []);
myApp.value('m_width', '100'); //some init value
myApp.controller('DemoController', ['m_width', function DemoController(m_width) {
$http.get("http://xxxxx/getSliceConfig")
.success(function(response)
{
$scope.config = [];
var x = //something from response;
$scope.$emit('eventName', { width: x });
...
}
}]);
myApp.controller('otherController', ['m_width', function otherController(m_width) {
$scope.$on('eventName', function (event, args) {
$scope.message = args.width;
console.log($scope.message);
});
$scope.width = m_width;
}]);
The problem is angularApp.js
uses an asynchronous ajax call, and the script in your main page prints machineLength
before the response arrives. 问题是
angularApp.js
使用异步ajax调用,并且主页中的脚本在响应到达之前就打印了machineLength
。
One solution would be for your angularApp script to inform the script in your main page when the response arrives. 一种解决方案是让angularApp脚本在响应到达时通知您主页中的脚本。 In angularApp.js:
在angularApp.js中:
...
.success(function(response) {
$scope.config = [];
$scope.config.machine_width = machineLength.x = parseFloat(response.config.machine_width);
angularFinishedJob(); // call the script in the main page when job is done
...
Main page: 主页:
<script>
console.log(machineLength); // empty object, because angular job didn't finish
function angularFinishedJob(){ // called from angularApp.js
console.log(machineLength); // calculated object
// add code which uses machineLength
}
</script>
Note: I think this would be the easiest method to implement if you have access to modifying angularApp.js
. 注意:我认为如果您有权修改
angularApp.js
这将是最容易实现的方法。 If not, others solutions exist 如果没有,则存在其他解决方案
Inject $window and use that: 注入$ window并使用:
let sliceApp = angular.module('sliceConfig', []);
sliceApp.
.controller('sliceConfigController', function($window, $scope, $http)
{
$http.get("http://xxxxx/getSliceConfig")
.success(function(response)
{
$scope.config = [];
//$scope.config.machine_width = machineLength.x = parseFloat(response.config.machine_width);
$scope.config.machine_width = $window.machineLength.x = parseFloat(response.config.machine_width);
...
}
});
I don't recommend using either the global object or $rootScope
for storing values but it will work. 我不建议使用全局对象或
$rootScope
来存储值,但是它将起作用。
Instead, I recommend using a value provider: 相反,我建议使用值提供程序:
let sliceApp = angular.module('sliceConfig', []);
sliceApp.value("machineLength", {});
sliceApp.
.controller('sliceConfigController', function(machineLength, $scope, $http)
{
$http.get("http://xxxxx/getSliceConfig")
.success(function(response)
{
$scope.config = [];
$scope.config.machine_width = machineLength.x = parseFloat(response.config.machine_width);
...
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.