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

Question

I would like to have clarifications about data-binding with AngularJS. I wish to have an array in service and share it with multiple controllers.

I would like , when a controller modify data in service, that the modification was take in account in others controllers et theirs html templates was update automatically.

Unfortunately, I succeed a little, but not with an angular manner because I use for this the Observer pattern or angular.copy..

When I try with a pure angular way, it does not work.

Here an example of code:

The service that contains datas to shared

app.factory( "MyService", [
function () {

    myTableToShare = [];

    return {

        myTableToShared : myTableToShare,
    };
}

] );

The controller that modify data of service

app.controller( 'AddCtrl', [
    '$scope', 'MyService', function ( $scope, MyService ) {

        $scope.myService = MyService;

        $scope.addElementToSharedTable = function( element ) {

            $scope.myService.myTableToShare.push( element );

        };
    }] );

The controller that permit to print datas of table into template

app.controller( 'ReadCtrl', [
    '$scope', 'MyService', function ( $scope, MyService ) {

        $scope.myService = MyService;
    }] );

**The template that print elements of table **

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

I have apply this method thanks to differents HOWTO. unfortunately these HOWTO did not use an array object but a String. Is it a path to follow?

In waiting I apply the pattern observer et I notify events from controller to services but it seems to me that its not a good solution because it too verbose.

Thaks

Answer 1

如果控制器在同一模块“ app”中，请使用app.value（...）。