从AngularJS服务内部访问$scope属性

Accessing $scope properties from inside a service in AngularJS

本文关键字:scope 属性 访问 内部 AngularJS 服务      更新时间:2023-09-26

我正在尝试在angular服务中创建一个构造函数,然后我可以在不同的angular控制器中使用它。问题是,从构造函数生成的对象需要访问$scope对象上的一个属性才能正常工作。

我已经实现了我所追求的功能,但它涉及到将$scope对象作为参数传递给构造函数。有没有更好的方法来做到这一点?我目前实施的方式有什么问题吗?

HTML:

<div ng-app="myApp">
    <div ng-controller="myController">
        <input type="text" ng-model="hello" />
        <br/>{{hello}}
        <br/>{{helloSayer.hello}}
        <br/>{{helloSayer.helloLength()}}
    </div>
</div>
JavaScript:

var myApp = angular.module('myApp', []);
myApp.controller('myController', function myController($scope, myService) {
    $scope.hello = 'Hello from controller';
    $scope.helloSayer = new myService.HelloSayer($scope);
});
myApp.factory('myService', function () {
    var HelloSayer = function (controllerScope) {
        this.hello = 'Hello from service';
        this.helloLength = function () {
            return controllerScope.hello.length;
        };
    };
    return {
        HelloSayer: HelloSayer
    };
});

下面是工作代码:http://jsfiddle.net/dBQz4/

您确实不希望到处传递作用域,它们是复杂的野兽。更重要的是,作为一般规则,明确你要传递的内容是个好主意。如果你只是需要一杯牛奶,就不要把奶牛送过来。

var myApp = angular.module('myApp', []);
myApp.controller('myController', function myController($scope, myService) {
    $scope.hello = 'Hello from controller';
    $scope.helloSayer = new myService.HelloSayer($scope.hello);
});
myApp.factory('myService', function () {
    var HelloSayer = function (controller_hello) {
        this.hello = 'Hello from service';
        this.helloLength = function () {
            return controller_hello.length;
        };
    };
    return {
        HelloSayer: HelloSayer
    };
});

传入需要操作的作用域是完全有意义的。这也将简化服务的单元测试。