How to execute AngularJS controller function on page load?

Question

Currently I have an Angular.js page that allows searching and displays results. User clicks on a search result, then clicks back button. I want the search results to be displayed again but I can't work out how to trigger the search to execute. Here's the detail:

• My Angular.js page is a search page, with a search field and a search button. The user can manually type in a query and press a button and and ajax query is fired and the results are displayed. I update the URL with the search term. That all works fine.
• User clicks on a result of the search and is taken to a different page - that works fine too.
• User clicks back button, and goes back to my angular search page, and the correct URL is displayed, including the search term. All works fine.
• I have bound the search field value to the search term in the URL, so it contains the expected search term. All works fine.

How do I get the search function to execute again without the user having to press the "search button"? If it was jquery then I would execute a function in the documentready function. I can't see the Angular.js equivalent.

Answer 1

On the one hand as @Mark-Rajcok said you can just get away with private inner function:

// at the bottom of your controller var init = function () {    // check if there is query in url    // and fire search in case its value is not empty }; // and fire it after definition init(); 

Also you can take a look at ng-init directive. Implementation will be much like:

// register controller in html <div data-ng-controller="myCtrl" data-ng-init="init()"></div>  // in controller $scope.init = function () {     // check if there is query in url     // and fire search in case its value is not empty }; 

But take care about it as angular documentation implies (since v1.2) to NOT use ng-init for that. However imo it depends on architecture of your app.

I used ng-init when I wanted to pass a value from back-end into angular app:

<div data-ng-controller="myCtrl" data-ng-init="init('%some_backend_value%')"></div> 

Answer 2

Try this?

$scope.$on('$viewContentLoaded', function() {     //call it here });