Como executar a função do controlador AngularJS no carregamento da página?

Atualmente, tenho uma página Angular.js que permite pesquisar e exibir resultados. O usuário clica em um resultado da pesquisa e depois no botão Voltar. Quero que os resultados da pesquisa sejam exibidos novamente, mas não consigo descobrir como acionar a pesquisa para executar. Aqui está o detalhe:

• Minha página Angular.js é uma página de pesquisa, com um campo de pesquisa e um botão de pesquisa. O usuário pode digitar manualmente uma consulta e pressionar um botão e a consulta ajax é acionada e os resultados são exibidos. Eu atualizo o URL com o termo de pesquisa. Isso tudo funciona bem.
• O usuário clica em um resultado da pesquisa e é levado para uma página diferente - que também funciona bem.
• O usuário clica no botão Voltar e volta à minha página de pesquisa angular, e o URL correto é exibido, incluindo o termo de pesquisa. Tudo funciona bem.
• Eu vinculei o valor do campo de pesquisa ao termo de pesquisa no URL, para que ele contenha o termo de pesquisa esperado. Tudo funciona bem.

Como faço para executar a função de pesquisa novamente sem que o usuário precise pressionar o "botão de pesquisa"? Se fosse jquery, eu executaria uma função na função documentready. Não consigo ver o equivalente ao Angular.js.

Por um lado, como @ Mark-Rajcok disse que você pode simplesmente se dar bem com a função interna privada:

// 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();

Além disso, você pode dar uma olhada na diretiva ng-init . A implementação será muito parecida com:

// 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
};

Mas tome cuidado com isso, pois a documentação angular implica (desde a v1.2) NÃO usar ng-initpara isso. No entanto, depende da arquitetura do seu aplicativo.

Eu usei ng-initquando queria passar um valor do back-end para o aplicativo angular:

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

Tente isso?

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

Eu nunca consegui $viewContentLoadedtrabalhar para mim e ng-initrealmente só deveria ser usado em um ng-repeat(de acordo com a documentação), e também chamar uma função diretamente em um controlador pode causar erros se o código se basear em um elemento que ainda não foi definido. .

Isto é o que eu faço e funciona para mim:

$scope.$on('$routeChangeSuccess', function () {
  // do something
});

A menos que você esteja usando ui-router. Então é:

$scope.$on('$stateChangeSuccess', function () {
  // do something
});

angular.element(document).ready(function () {

    // your code here

});

A solução de Dimitri / Mark não funcionou para mim, mas o uso da função $ timeout parece funcionar bem para garantir que seu código seja executado somente após a marcação ser processada.

# Your controller, including $timeout

var $scope.init = function(){
 //your code
}

$timeout($scope.init)

Espero que ajude.

Você pode fazer isso se quiser assistir o objeto DOM viewContentLoaded mudar e, em seguida, fazer alguma coisa. O uso de $ scope. $ on também funciona, mas de maneira diferente, especialmente quando você tem um modo de página no seu roteamento.

 $scope.$watch('$viewContentLoaded', function(){
    // do something
 });

Você pode usar o objeto $ window do angular:

$window.onload = function(e) {
  //your magic here
}

Outra alternativa:

var myInit = function () {
    //...
};
angular.element(document).ready(myInit);

(via https://stackoverflow.com/a/30258904/148412 )

Outra alternativa, se você tiver um controlador específico para essa página:

(function(){
    //code to run
}());

Ao usar $ routeProvider, você pode resolver .state e inicializar seu serviço. Isto é, você irá carregar o Controller e o View, apenas após resolver o seu Serviço:

rotas ui

 .state('nn', {
        url: "/nn",
        templateUrl: "views/home/n.html",
        controller: 'nnCtrl',
        resolve: {
          initialised: function (ourBootstrapService, $q) {

            var deferred = $q.defer();

            ourBootstrapService.init().then(function(initialised) {
              deferred.resolve(initialised);
            });
            return deferred.promise;
          }
        }
      })

Serviço

function ourBootstrapService() {

 function init(){ 
    // this is what we need
 }
}

Dmitry Evseev achou a resposta bastante útil.

Caso 1: Usando angularJs sozinho:
Para executar um método no carregamento da página, você pode usar ng-inito modo de exibição e declarar init no controller, tendo dito que o uso da função mais pesada não é recomendado, conforme os documentos angulares no ng-init :

Esta diretiva pode ser abusada para adicionar quantidades desnecessárias de lógica aos seus modelos. Existem apenas alguns usos apropriados do ngInit, como alias de propriedades especiais do ngRepeat, como visto na demonstração abaixo; e para injetar dados via script do lado do servidor. Além desses poucos casos, você deve usar controladores em vez de ngInit para inicializar valores em um escopo.

HTML:

<div ng-controller="searchController()">
    <!-- renaming view code here, including the search box and the buttons -->
</div>

Controlador:

app.controller('SearchCtrl', function(){

    var doSearch = function(keyword){
        //Search code here
    }

    doSearch($routeParams.searchKeyword);
})

Atenção : Não use este controlador para outra visualização destinada a uma intenção diferente, pois isso também fará com que o método de pesquisa seja executado lá.

Caso 2: Usando o Ionic:
O código acima funcionará, apenas certifique-se de que o cache de exibição esteja desativado da seguinte route.jsmaneira:

route.js

.state('app', {
    url           : '/search',
    cache         : false, //disable caching of the view here
    templateUrl   : 'templates/search.html'   ,
    controller    : 'SearchCtrl'
  })

Espero que isto ajude

Eu tive o mesmo problema e apenas esta solução funcionou para mim (ela executa uma função depois que um DOM completo foi carregado). Eu uso isso para rolar para ancorar depois que a página foi carregada:

angular.element(window.document.body).ready(function () {

                        // Your function that runs after all DOM is loaded

                    });

Você pode salvar os resultados da pesquisa em um serviço comum que pode ser usado de qualquer lugar e não é limpo quando navegar para outra página e, em seguida, você pode definir os resultados da pesquisa com os dados salvos ao clicar no botão Voltar

function search(searchTerm) {
    // retrieve the data here;
    RetrievedData = CallService();
    CommonFunctionalityService.saveSerachResults(RetrievedData);
} 

Para o seu backbutton

function Backbutton() {
    RetrievedData = CommonFunctionalityService.retrieveResults();
}

chamar métodos iniciais dentro da função de auto-inicialização.

(function initController() {

    // do your initialize here

})();