我正在尝试加载两个分开的 ng-app 模块,但第二个模块没有加载。我使用 angular.boostrap 将 id 添加到第二个模块,但我仍然得到一个错误的代码。它适用于 jfiddle,但不适用于 Sublime 文本编辑器 3。
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>RuneScape Toolkit</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.js"></script>
</head>
<body>
<div id="xpdef" ng-app="xpCalc" ng-controller="xpCalculatorController">
<p>Insert your current Level <input type="number" ng-model="currentLevel"></p>
<p>Insert your desired Level <input type="number" ng-model="desiredLevel" ></p>
<h2>{{xpleft() | number}}</h2>
</div>
<br>
<div id="saycmbt" ng-app="cmbtCalc" ng-controller="CombatCalculatorController">
<p>Insert your Attack Level <input type="number" ng-model="ALvl"></p>
<p>Insert your Strength Level <input type="number" ng-model="SLvl"></p>
<p>Insert your Magic Level <input type="number" ng-model="MLvl"></p>
<p>Insert your Range Level <input type="number" ng-model="RLvl"></p>
<p>Insert your HitPoints Level <input type="number" ng-model="HLvl"></p>
<p>Insert your Defense Level <input type="number" ng-model="DLvl"></p>
<p>Insert your Prayer Level <input type="number" ng-model="PLvl"></p>
<h2> {{combatlevel() | number}} </h2>
</div>
<script type="text/javascript" src="xpCalc.js"></script>
<script type="text/javascript" src="cmbtCalc.js"></script>
</body>
</html>
第一个JS:
var app = angular.module('xpCalc', []);
app.factory('xpService',function(){
var service = {};
function calculate(level) {
var output = 0;
for (var i = 1; i < level; i++) {
output += (Math.floor(i + 300 * Math.pow(2, i / 7)) / 4);
}
return output;
}
service.getxpLeft = function(currentLevel,desiredLevel){
var currentXp = calculate(currentLevel);
var desiredXp = calculate(desiredLevel);
return desiredXp - currentXp;
};
return service;
});
app.controller('xpCalculatorController', function($scope,xpService) {
$scope.currentLevel = 1;
$scope.desiredLevel = 1;
$scope.xpleft = function() {
return xpService.getxpLeft($scope.currentLevel,$scope.desiredLevel);
};
});
angular.bootstrap(document.getElementById("xpdef"), ['cmbtCalc']);
第二个JS:
var app=angular.module('cmbtCalc', []);
app.controller('CombatCalculatorController', function($scope){
$scope.Alvl = 1 ;
$scope.SLvl = 1 ;
$scope.MLvl = 1 ;
$scope.RLvl = 1 ;
$scope.HLvl = 10 ;
$scope.DLvl = 1 ;
$scope.PLvl = 1 ;
$scope.combatlevel=function(){
return $scope.DLvl+$scope.HLvl;
};
});
angular.bootstrap(document.getElementById("saycmbt"), ['cmbtCalc']);