Question

想法是编写一个简单的服务，将2个数字相乘，然后将其传递给控制器并在html页面中显示。但是，我似乎无法显示结果，因为它只显示{{product}}。

编辑：当我将对象移动到与服务相同的文件中时，它可以正常工作。但是，当我将它放在一个名为objects.js的单独文件（在同一文件夹中）时，它就像停止对服务可见，并且不再有效。我想让它像那样工作。

以下是代码的所有部分：

JavaScript对象：

    function Multiplier(valueFactor) {
    	this.multiply = function (controllerFactor) {
    		return valueFactor * controllerFactor;
    	};
    }

服务：

var services = angular.module("services",[]);
services.value('factor',6);
services.service('multiplier',['factor', Multiplier]);

控制器：

var app = angular.module("app",['services']);

app.controller('multiplyController',['$scope','multiplier', function($scope,multiplier) {
	$scope.product = multiplier.multiply(2);
}]);

HTML页面：

<!DOCTYPE html>
<html ng-app="app">
	<head>
	
	</head>
	<body>
		<div ng-controller="multiplyController">
			{{product}}
		</div>
		
		<script src="js/angular.js"></script>
		<script src="js/angular-route.js"></script>
		<script src="js/jquery.min.js"></script>
		
		<script src="app/app.js"></script>
		<script src="app/controllers.js"></script>
		<script src="app/services.js"></script>
		
	</body>
</html>

Answer 1

你在这里调用角var app = angular.module("app",['services']); 您应该将app变量用于其余代码，例如：

app.controller('mycontrl', [function(){/*...*/}])

app.service('mysrvc1', [function(){/*...*/}])

app.service('mysrvc2', [function(){/*...*/}])

app.factory('myfact', [function(){/*...*/}])

您只需安装一次angular.module()

即可

Answer 2

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Test</title>

  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

<script>
var app = angular.module("app",[]);

function Multiplier(valueFactor) {
        this.multiply = function (controllerFactor) {
            return valueFactor * controllerFactor;
        };
    }

app.value('factor',6);
app.service('multiplier',['factor', Multiplier]);

app.controller('multiplyController',['$scope','multiplier', function($scope,multiplier) {
    $scope.product = multiplier.multiply(2);
}]);
  </script>
</head>
<body ng-app="app">
 <div ng-controller="multiplyController">
            {{product}}
        </div>
</body>
</html>

AngularJS似乎没有看到JavaScript对象？

2 个答案: