javascript - Creating an updating list view with dummy content via AngularJS -

i'm using angularjs build application allows users build reports , submit them. title , time of creation automatically generated (based on user input), , report summary added list of of reports user has made.

the table populated server-side json string (and new entries added server local session), local testing, need way add table during local client-side session.

a user go separate page can create report: once click "run report," report summary should added table, name of report , date created automatically populated user's input. report-creating interface on different page , consequentially different controller scope "main" page list of report summaries resides.

now, here's question: what best, angular-tastic way submit report summary table (a.k.a. local model) from different controller $scope?

my code looks (keep in mind dreadful, , i'm planning refactor it!):

controllers.js:

var mainctrl = function($scope) {   $scope.reports = [     {name:'trx summary', date:'mar 20, 2013 @ 12:30pm'},     {name:'trx summary', date:'mar 20, 2013 @ 12:30pm'}   ]; }; 

_dat_partial_view.html:

<div ng-controller="mainctrl" class="row-fluid">   <table class="table table-striped">     ...     <tr ng-repeat="report in reports">       <td>         <p>{{report.name}} <span class="label label">generating</span></p>       </td>       <td>         <dl class="no-margin">           <dt>date range</dt>           <dd>mar 3, 2013 - mar 13, 2013</dd>           <dt>generated</dt>           <dd>{{report.date}}</dd>         </dl>       </td>       ...     </tr>     

this creates dummy content populates table 2 entries.

what need create such dynamic list-adder? i'm pretty sure need push elements array, have no idea how outside of current controller $scope. tried placing array's code outside of controller $scope:

controllers.js:

reports = [         {name:'trx summary', date:'mar 20, 2013 @ 12:30pm'},         {name:'trx summary', date:'mar 20, 2013 @ 12:30pm'}       ];  var mainctrl = function($scope) {}; 

this removed 2 dummy entries table, didn't work.

any ideas?

question 2

another question: what best way create dynamic list of content populates table? app create report, , store locally. try push new report server, generate report , theoretically send result concatenates json string. in other words, report stays local until sent , generated server. user cannot read report until generated, report remain saved locally if server cannot, reason, accept request generate new report.

this said, i've seen examples suggest using service or factory. wisest thing do? better simple array i've got set now?

you should using service here, think example referenced correct approach