Angular service, example

share data among controllers

HTML

<h3> List </h3>
<ul ng-controller='Ctrl1'>
    <li ng-repeat="item in items">{{item}}</li>
</ul>
<div ng-controller="Ctrl2">
    <input type="text" ng-model="newName" placeholder="type a new item"/>
    <button ng-click="addNew(newName)">Add to list</button>
</div>

JavaScript

var app = angular.module('myApp', []);
app.controller('Ctrl1', function ($scope, myListService) {
    $scope.items = myListService.getList();
});
app.controller('Ctrl2', function ($scope, myListService) {
    $scope.addNew = myListService.add;
});
app.service('myListService', function () {
    var list = [];



    var getList = function () {
        return list;
    };
    var add = function (newEntity) {
        list.push(newEntity);
    };
    return {
        getList: getList,
        add: add
    };
});