Databases
StackOverflow2013
Postsdbo
POAngular Controller executes on each ajax partial reresh
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POAngular Controller executes on each ajax partial reresh
    primarykey
    data
    text
    <p>I am adding some functionality to an existing Microsoft MVC 3 application. I cannot change the existing structure of the app itself while I do need to add some new functionality to the page. I have angular running in a div (hidden on load via jquery dialog). The MVC app has several tabs on the page. Each time a tab is chosen, the a partial cshtml (razor) loads. Along with that partial, my angular template is included. The partial references a js file that contains the angular controller. When it is first loaded and the user opens the tab and open the jquery dialog containing angular, everything works fine. I started to notice some funny behavior after the changes are saved. I noticed the same irregular behavior if I closed the dialog containing the angular template, switched to another tab, then switched back to the tab containing the angular template. Here's what is happening:</p> <ul> <li>The partial being loaded by MVC reloads the angular template which initiates the angularjs controller method in the referenced js file</li> <li>A new $scope is being generated each time this occurs.</li> <li>Each time a controller method is invoked (via ng-click event tied to a button on the template) teh method will execute n number of times with n being the number of times the partial has been loaded since the last full page refresh.</li> </ul> <p>I proved this method by logging the $scope object to the window in the start of the controller method</p> <pre><code>window['scope_' + new Date().getTime().toString()] = $scope; </code></pre> <p>After each partial page load, a new $scope object is logged to the window. Pressing a button on the template invoked a certain method tied to the ng-click event. This event fires multiple times. But calling the method manually in the console using the oldest recorded scope object in the window</p> <pre><code>scope_1378413848781.$apply(scope_1378413848781.getSomeData()) </code></pre> <p>it works as intended. <strong>So, my question is, how do I prevent the controller from adding a new scope every time the MVC framework reloads the partial?</strong></p> <p>Here are some of the things I've tried that didn't work:</p> <ul> <li>Adding a global flag and exiting the controller method if it was set</li> <li>moving the controller reference to the _layout.cshtml file </li> <li>destroying the scope when the dialog containing the template is closed</li> </ul> <p>One final note, I am not using the angular route provider which I know can cause the controller to execute twice when used in conjunction with .</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USJK Dennis
    1. USJK Dennis
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload