Check out the following code snippet.
Click on the bold hello text. The scope is updated from the factory, but the view does not reflect the changes. I have tried using scope.apply() to update the view, but it doesn't seem to be working as expected. Therefore, I am anticipating the bold text to get updated. Keep in mind that the data in the factory can be modified from anywhere, so simply calling scope.$apply() on the click event won't suffice.
angular.module('myModule', [])
.factory('myFactory', function($http, $window){
return { str:'hello' };
})
.directive('mydir', ['$timeout', 'myFactory', function ($timeout, myFactory) {
return {
restrict: 'E',
scope: {},
template: '<div><b>{{myf.str}}</b>',
link: function (scope, elem, attrs, ctrl) {
scope.myf = myFactory;
scope.$watch('scope.myf', function(n, o) {
scope.$apply();
});
elem.bind('click', function(){
myFactory.str += '1';
elem.append(scope.myf.str);
});
}
};
}])<html ng-app='myModule'>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<mydir></mydir>