0

I have an angular app which has a ng-view which (like any good MVC should) manipulates how the model is shown. The data (model) comes from a database, and I call it into the app's component. From there I want to propagate (if that's the right word) the model into ng-view, which loads a template to display the data based on the route. I also want to be able to filter the data/model that goes into the view with a "top-bar"

I.e:

INDEX.HTML:

<html ng-app="app">
<head>...</head>
<body ng-controller="appController">
  <top-bar></top-bar>
  <div ng-view></div>
</body>
</html>

APP.JS:

angular.module('app', ['top-bar','view-one','view-two', 'ngRoute']);
angular.module('app').controller('appController', function() {
  var self = this;
  this.myData = [];
  $http.get('theQuery').then(res => self.myData = res.data);
});
angular.config(function($routeProvider, $locationProvider) {
  $routeProvider
  .when('/view-one', {template:'<view-one></view-one>'})
  .when('/view-two', {template:'<view-two></view-two>'});
});

angular.module('top-bar', ['ngRoute']);
angular.module('top-bar').component('top-bar', {
  templateUrl: './app/top-bar/top-bar.template.html',
  controller: function(filterFilter) {
    this.filters = filterFilter(...);
  }
});

angular.module('view-one', ['ngRoute']);
angular.module('view-one').component('view-one', {
  templateUrl: './app/view-one/view-one.template.html',
  controller: function(filterFilter) {
    // appController.data and topBar.filters would somehow
    // need to be gotten from those respective modules.
    this.data = appController.data;
    this.filter = topBar.filters;
  }
});

What I am trying to figure out is how to get the data from the main app's controller (appController) and the top-bar component, and send it to whatever view is currently loaded into ng-view.

I've been searching the web, I cannot find if the better way to do this would be to use binding (i.e. binding: {data:'<'})in the view-one controller/component, a system of $scopes, a custom service or something else. I also can't find out I would accomplish using either one to get the data in there. Thus any answers that also include a) code samples and b) links to further documentation I could read up on would be would be much appreciated.

4lackof
  • 1,250
  • 14
  • 33

1 Answers1

0

The recommended way for doing this is to create a service, and let the different controllers work with the reference to the objects provided by the service.

Possible duplicate of enter link description here

Luv
  • 386
  • 4
  • 15