Looking for a way to access $scope outside the UI view in my todo app. The structure is simple, with three panels as shown in this design
For the full code, visit here
I need to access the to-do detail on the third panel using $rootScope, which currently isn't the recommended method. Each of the three panels has its own controller and I'm changing the state of the UI router when clicking on a to-do item. I specifically require access to the to-do data in the third panel.
<!-- Routers -->
.state('dashboard', {
url: '/dashboard',
abstract: true,
views: {
'': {
templateUrl: './partials/main.html'
},
'header_toolbar@dashboard': {
templateUrl: './views/header_toolbar.html'
},
'sidenavleft@dashboard': {
templateUrl: './views/sidenav.html'
},
'todo_detail@dashboard': {
templateUrl: './views/todo_detail.html'
}
}
})
... (omitted for brevity) ...
<!-- ----------------Controllers --------------------- ->
app.controller("ListController", ['$rootScope', '$scope', '$state', ... {
... (controller details)
}]);
app.controller("TodoDetailController", ['$rootScope', '$scope', '$state', ... {
... (controller details)
}]);
<!-- Main.html -->
<div id="appContainer" md-theme="{{ dynamicTheme }}" ng-init="load()" md-theme-watch>
<!-- Header Toolbar -->
<div ui-view="header_toolbar"></div>
<div layout="row" layout-xs="column" layout-sm="column">
<!-- Sidenav right view -->
<div ui-view="sidenavleft" id="nav_container"></div>
<!-- Main middle container -->
<div flex="100" flex-gt-sm="55" layout="column" id="list_content">
<md-content layout="column" flex class="md-padding">
<div ui-view></div>
</md-content>
</div>
<!-- Todo Detail View -->
<div ui-view="todo_detail" id="todo_detail_view"></div>
</div>
</div>Avoiding data passing through $rootScope is a priority for me. Currently, the issue lies in the fact that when clicking on a to-do item, both the list and detail should remain visible. However, the middle template disappears upon clicking on a to-do item due to the placement of "Todo Detail View" outside the UI view.
The main challenge is needing to access data within "Todo Detail View".