如何在页面加载时执行AngularJS控制器功能？

Question

目前我有一个Angular.js页面,允许搜索和显示结果.用户单击搜索结果,然后单击后退按钮.我希望再次显示搜索结果,但我无法确定如何触发搜索执行.这是详细信息:

• 我的Angular.js页面是一个搜索页面,带有搜索字段和搜索按钮.用户可以手动键入查询并按下按钮,并触发ajax查询并显示结果.我用搜索词更新了URL.一切正常.
• 用户点击搜索结果并转到另一个页面 - 这也可以正常工作.
• 用户单击后退按钮,然后返回到我的角度搜索页面,并显示正确的URL,包括搜索词.一切正常.
• 我已将搜索字段值绑定到URL中的搜索词,因此它包含预期的搜索词.一切正常.

如何在用户不必按"搜索按钮"的情况下再次执行搜索功能？如果它是jquery,那么我将在documentready函数中执行一个函数.我看不到Angular.js的等价物.

Answer 1

一方面,正如@ Mark-Rajcok所说,你可以逃脱私人内在功能:

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

您还可以查看ng-init指令.实施将很像:

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

但要注意它,因为角度文档暗示(因为v1.2)不使用ng-init它.但是,它取决于您的应用程序的架构.

ng-init当我想将值从后端传递到角度应用程序时,我使用了:

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

Answer 2

试试这个？

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

Answer 3

我永远无法$viewContentLoaded为我工作,并且ng-init应该只用于ng-repeat(根据文档),并且如果代码依赖于尚未定义的元素,也直接在控制器中调用函数会导致错误.

这就是我的工作,它对我有用:

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

除非你正在使用ui-router.那就是:

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

Answer 4

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

    // your code here

});

Answer 5

Dimitri的/ Mark的解决方案对我不起作用,但是使用$ timeout函数似乎可以很好地确保代码仅在呈现标记后运行.

# Your controller, including $timeout

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

$timeout($scope.init)

希望能帮助到你.

Answer 6

如果要观察要更改的viewContentLoaded DOM对象然后执行某些操作,则可以执行此操作.使用$ scope.$ on也可以,但不同,特别是当你的路由有一个页面模式时.

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

Answer 7

你可以使用angular的$ window对象:

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