Sharing data between AngularJS controllers but having the shared data come from an Ajax call

Question

I\'ve figured out how to share data between two AngularJS controllers using a shared service in the contrived example below:

(Functioning fiddle)

var app         


        

Answer 1

Here are some starting points to help you out:

1. How to get the data from the server (and how to construct a basic 'model' service): SO post

2. How to hold the controller execution until data is fetched from the server: screencast from egghead.io

Answer 2

I've created this example that shows how to fetch, store and share data (models) across different controllers without loosing its bindable functionality.

Live Example: http://pablodenadai.github.io/SharingModelsAngularJS/

Source code 1: (Resources and Model abstraction) https://github.com/pablodenadai/SharingModelsAngularJS/blob/master/app/scripts/controllers/main.js

Repo: https://github.com/pablodenadai/SharingModelsAngularJS

Hope it helps.