javascript - Can you update a controller that updates it's child scopes? -

lets have controller & directive so:

app.controller('maincontroller', function($scope) {     $scope.loading = true;     $scope.updatetest = function(){         $scope.loading = false;     } }).directive('loading', function() {     return {         restrict : 'e',         transclude: true, // use parent scope         link : function(scope, element, attrs) {             scope.$watch('loading', function(ctx) {                 console.log('updating?', ctx)             });         }     } }); 

and html markup:

<section ng-controller="maincontroller">     <loading ng-show="loading">         loading?     </loading>     <button ng-click="updatetest()">force update</button> </section> 

i want know how watch parent scope within directive, can't seem working!

i'm using angular 1.3.16

i recommend use isolate scope , pass variables throw it:

.directive('loading', function() {   return {     restrict : 'e',     scope: {       ngmodel: '='     },     transclude: true, // use parent scope     link : function(scope, element, attrs) {         scope.$watch('ngmodel', function(ctx) {             console.log('updating?', ctx)         });     }   } }); 

html

<loader ng-model="loading" ng-show="loading">     loading? </loader>