服务和控制器之间的AngularJS数据绑定

AngularJS data binding between service and controllers

本文关键字:AngularJS 数据绑定 之间 控制器 服务      更新时间:2023-09-26

我想澄清一下与AngularJS的数据绑定。我希望有一个阵列在服务中,并与多个控制器共享它。

我希望,当一个控制器修改服务中的数据时,其他控制器会考虑到修改,并且他们的html模板会自动更新。

不幸的是,我成功了一点,但不是以角度的方式,因为我使用了观察者模式或角度副本。

当我尝试使用纯角度的方式时,它不起作用。

这里有一个代码示例:

包含要共享的数据的服务

app.factory( "MyService", [
function () {
    myTableToShare = [];
    return {
        myTableToShared : myTableToShare,
    };
}

]);

修改服务数据的控制器

app.controller( 'AddCtrl', [
    '$scope', 'MyService', function ( $scope, MyService ) {
        $scope.myService = MyService;
        $scope.addElementToSharedTable = function( element ) {
            $scope.myService.myTableToShare.push( element );
        };
    }] );

允许将表格数据打印到模板中的控制器

app.controller( 'ReadCtrl', [
    '$scope', 'MyService', function ( $scope, MyService ) {
        $scope.myService = MyService;
    }] );

**打印表格**元素的模板

<div ng-controller="ReadCtrl">
    <ul >
        <li  ng-repeat="element in myService.myTableToShare">   
            <span>{{element.id}} - {{element.name}}</span>
        </li>
    </ul> </div>

由于HOWTO的不同,我采用了这种方法。不幸的是,这些HOWTO没有使用数组对象,而是使用字符串。这是一条要走的路吗?

在等待过程中,我应用了模式观测器,并将事件从控制器通知给服务,但在我看来,这不是一个好的解决方案,因为它太冗长了。

Thaks

如果控制器在同一模块"app"中,则使用app.value(…)。