web - AngularJS - How do I modify variables in $rootScope? -

web - AngularJS - How do I modify variables in $rootScope? -

i've got potentially dumb question, how modify variables in $rootscope in angular? i've got slide-in sidebar want alter content on whenever clicks on thumbnail, , figured easiest way handle info in sidebar comes from/the sidebar visibility either in global values, or in $rootscope. i'm trying maintain simple possible, don't know how handle modifying global variables.

my angular code surrounding is:

app.run(function($rootscope) { $rootscope.currenturl = { value: 'visual/design/1/' }; $rootscope.detail_visible = { value: true }; }); app.controller('navcontroller', ['$scope', '$rootscope', function ($scope, $rootscope) { $scope.isdetail = $rootscope.detail_visible.value; $scope.url = $rootscope.currenturl.value; $scope.hide = function($rootscope) { $rootscope.detail_visible.value = false; }; }]);

and connecting html is

<div id="detail_box" ng-class="{d_show: isdetail, d_hide: !isdetail}"> <a href="#" class="box_close" ng-click="hide()"></a> <div ng-include="url + 'detail.html'"></div> </div>

in essence, i'm trying create when click on thumbnail, changes currenturl value 'visual/design/1/' whatever they've clicked on (like, 'music/solo/2' or whatever) changes value of detail_visible false, classes on sidebar switch , nice little slide-in, fresh content loaded via ng-include kind of love one thousand times more thought would. i've been banging head against 3 hours now, breaking else on app whenever chance. screwing here? alternatively, there improve way of doing this?

my reason using global variables have multiple thumbnails in multiple controllers, , want each 1 able dynamically alter url in ng-include.

for question, alter $rootscope variable simple referencing

$rootscope.detail_visible.value = newvalue;

but dont need inject $rootscope function:

$scope.hide = function() { //without $rootscope $rootscope.detail_visible.value = false; };

but, suggest implement service , not pollute rootscope such task.

https://docs.angularjs.org/guide/services

angularjs web rootscope