Angular+JQ

by basarat

HTML

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>
<div ng-controller="Ctrl1">
    <h2 ng-click="toto(); titi();">Ctrl1</h2>
    <ul>
        <li ng-repeat="item in list">{{item}}</li>
    </ul>
</div>
<hr />
<div ng-controller="Ctrl2">
    <h2>Ctrl2</h2>
      <ul>
        <li ng-repeat="item in list">{{item}}</li>
    </ul>
</div>

JavaScript

var app = angular.module('myApp', []);

var heavyFunction = function(cb) {
    setTimeout(function() {
        console.log(Date.now());
        cb([1, 2, 3, 4]);
    }, 2000);
};

app.factory('service', function($q, $rootScope) {
    
    var taskInTheFuture = $q.defer();
    
    heavyFunction(function(data){
        $rootScope.$apply(function(){
            taskInTheFuture.resolve(data);
        });        
    });
    
    return {
        list : taskInTheFuture.promise       
    };
});

function Ctrl1($scope, service) {
    $scope.list = service.list;
}

function Ctrl2($scope, service) {
    $scope.list = service.list;
}