How to update the `$scope` object from `directive` controller

Question

I am trying to update the $scope object from controller, But it's not updating. but in console i am getting updated status.

here is my code :

var galleryMenu = ['$route', function ($route) {

    return {

        scope : true,

        replace : true,

        template : function () {

            var page = $route.current.className || 'home';

            return galleryMenuItem(page);

        },

        controller : function ($scope, $element) {

            $scope.galleryProject = function () {

                $scope.galleryShow = !$scope.galleryShow;
                console.log($scope.galleryShow) //gives me true, but `DOM` not updating.

            }


        }

    }

}];

score 3 · Accepted Answer · edited May 23 '17 at 11:51

3

Your directive is using scope: true that means you have create a scope which is prototypically inherited from parent scope.

Then your galleryShow object should follow dot rule

$scope.model = {};
$scope.model.galleryShow = 'something';

So then in your directive you could get $scope.model object by prototypal inheritance and you could change it by $scope.model.galleryShow will change parent scope.

Directive Controller

controller : function ($scope, $element) {
     $scope.galleryProject = function () {
         $scope.model.galleryShow = !$scope.galleryShow;
         console.log($scope.model.galleryShow) //gives me true, but `DOM` not updating.
     }
  }

edited May 23 '17 at 11:51

Community

1
1

answered Jun 26 '15 at 20:05

Pankaj Parkar

134,766
23
234
299

Ok, if I give `scope:false`, is that possible to update in parent scope? – 3gwebtrain Jun 26 '15 at 20:08
Yes, this is working. and i need to append a `directive to DOM with ng-repeat` - how to do that? – 3gwebtrain Jun 26 '15 at 20:09
yes, works. can you help me to append a `directive to DOM` with `ng-repeat`? is it possible to do from controller or i need to use `link` method here? – 3gwebtrain Jun 26 '15 at 20:13
@3gwebtrain to changes in a directive which I suggested then put that directive on `ng-repeat` DOM.. should work.. – Pankaj Parkar Jun 26 '15 at 20:14
Actually using this directive I am showing a `gallery` now gallery has not element. i would like to create elements by `ng-repeat`, that means when the `gallery` div on `visible` the `directive` inside automatically works? – 3gwebtrain Jun 26 '15 at 20:18
yes..it should work..Bit confused with what you are saying..could you elaborate more on it? – Pankaj Parkar Jun 26 '15 at 20:25
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/81682/discussion-between-3gwebtrain-and-pankajparkar). – 3gwebtrain Jun 26 '15 at 20:26
I have a `gallery` div. inside the div i have 3 directives. when the page is `home` i want to run the `page-gallery` directive. in case page is `service` i need to run the `server-gallery` directive - so how to handle that? – 3gwebtrain Jun 26 '15 at 20:31
at present, my gallery is shows when the `galleryShow` is `true`. again i need to insist the gallery to run only `home-gallery` - if i am not clear please post your question. – 3gwebtrain Jun 26 '15 at 20:32
@3gwebtrain could you come on chat? – Pankaj Parkar Jun 26 '15 at 20:36

How to update the `$scope` object from `directive` controller

1 Answers1