> For the complete documentation index, see [llms.txt](https://dsheiko.gitbook.io/ng-backbone/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://dsheiko.gitbook.io/ng-backbone/sharing_data_across_components.md).
# Sharing Data Across Components
Often that happens that we refer to the same data from different components. We need those components to update whenever that data change. That is easy to achieve with ngBackbone. We can instantiate a model or collection and pass the reference to all the corresponding components. For instance we can take the example from [Nesting Components](https://dsheiko.gitbooks.io/ng-backbone/content/nesting_components.html) and change our `foo.ts` and `bar.ts` to build a list of worlds from collections named `worlds`:
foo.ts
```javascript
import { Component, View } from "ng-backbone";
@Component({
el: "ng-foo",
template: `Hello, it's Foo
`
})
export class FooView extends View {
initialize(){
this.render();
}
}
```
The collection itself we create in `app.ts` and pass it to `AppView` and both `FooView` and `BarView` with view options:
app.ts
```javascript
import { Component, View, Collection, Model } from "ng-backbone";
import { FooView } from "./foo";
import { BarView } from "./bar";
let worlds = new Collection([
new Model({ name: "Post-Crisis Earth" }),
new Model({ name: "Red Son" }),
new Model({ name: "The Fourth World" }),
new Model({ name: "The Dakotaverse" })
]);
@Component({
el: "ng-hello",
events: {
"click button" : "addNewWorld"
},
views: {
foo: [ FooView, { collections: { worlds: worlds } } ],
bar: [ BarView, { collections: { worlds: worlds } } ]
},
template: `
`
})
class AppView extends View {
addNewWorld(){
let worlds = this.collections.get( "worlds" );
worlds.add(new Model({
"name": "A brand new world"
}));
}
}
let app = new AppView({ collections: { worlds: worlds }});
app.render();
```
After compilation of `app.ts` we see as both components rendered lists from the same collections: 
As we press the button, both the lists update:
