在 angular JS 的服务中声明对象

Question

我正在尝试使用代码将值放入 angular js 控制器的 html 页面中，该控制器注入了服务。

我在服务中创建了一个对象，并向该对象添加了一些值属性。接下来我在控制器中读取这个值。

现在我观察到的是服务的名称和对象的名称应该相同，只有这样值才能正确出现。

以下是HTML代码：-

<html>
  <head>
     <title>AngularJS Services</title>
     <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.5/angular.min.js"></script>
     <script type="text/javascript" src="abc.js"></script>
  </head>
  <body ng-app="myApp">
  <div ng-controller="Addition as add">
    <p>{{ add.num }}</p>
    </div>
  </body>
  </html>

以下是工作代码：-

abc.js

angular.module('myApp',[]);
angular.module('myApp').factory('number',function(){
var number={};
number.val=10;
return number;
});

angular.module('myApp').controller('Addition',function(number){

var self=this;
self.num=number.val;
});

以下是无效的代码：-

angular.module('myApp',[]);
angular.module('myApp').factory('number',function(){
var num={};
num.val=10;
return num;
});

angular.module('myApp').controller('Addition',function(number){

var self=this;
self.num=num.val;
});

服务名称和对象名称必须相同吗？

Answer 1

你犯了一个小错误。应该是：

angular.module('myApp').controller('Addition',function(number){

var self=this;
self.num=number.val;
});

Answer 2

那是因为你的函数中没有定义 num

angular.module('myApp')
.controller('Addition',function( number ){

    var self=this;
        self.num = num.val;
});

您得到的只是控制器中对 num 的引用。

'number' 只是你的工厂名称。因此，上面的代码将不起作用。

你必须使用。

angular.module('myApp')
.controller('Addition',function(number){

    var self=this;
    self.num = number.val;
});

在 angular JS 的服务中声明对象

Declaring objects in services in angular JS

angularjs

angularjs-service

angularjs-controller