目前我有一个Angular.js页面,允许搜索和显示结果。用户单击搜索结果,然后单击返回按钮。我想再次显示搜索结果,但我不知道如何触发搜索执行。细节如下:

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.

我如何让搜索功能再次执行,而不需要用户按下“搜索按钮”?如果是jquery,那么我会在documentready函数中执行一个函数。我找不到Angular.js的等价物。


当前回答

发现Dmitry Evseev的回答很有用。

案例1:单独使用angularJs: 要在页面加载中执行一个方法,你可以在视图中使用ng-init,并在控制器中声明init方法,虽然不建议使用更重的函数,但根据angular Docs中关于ng-init的说明:

这个指令可能会被滥用,在模板中添加不必要的逻辑。ngInit只有几个合适的用法,比如对ngRepeat的特殊属性进行混叠,如下面的演示所示;以及通过服务器端脚本注入数据。除了这几种情况,你应该使用控制器而不是ngInit来初始化作用域上的值。

HTML:

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

控制器:

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

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

    doSearch($routeParams.searchKeyword);
})

警告:不要将此控制器用于其他意图不同的视图,因为它将导致搜索方法也在那里执行。

案例2:使用Ionic: 上面的代码可以工作,只要确保视图缓存在route.js中被禁用:

route.js

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

希望这能有所帮助

其他回答

发现Dmitry Evseev的回答很有用。

案例1:单独使用angularJs: 要在页面加载中执行一个方法,你可以在视图中使用ng-init,并在控制器中声明init方法,虽然不建议使用更重的函数,但根据angular Docs中关于ng-init的说明:

这个指令可能会被滥用,在模板中添加不必要的逻辑。ngInit只有几个合适的用法,比如对ngRepeat的特殊属性进行混叠,如下面的演示所示;以及通过服务器端脚本注入数据。除了这几种情况,你应该使用控制器而不是ngInit来初始化作用域上的值。

HTML:

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

控制器:

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

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

    doSearch($routeParams.searchKeyword);
})

警告:不要将此控制器用于其他意图不同的视图,因为它将导致搜索方法也在那里执行。

案例2:使用Ionic: 上面的代码可以工作,只要确保视图缓存在route.js中被禁用:

route.js

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

希望这能有所帮助

另一个选择:

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

(通过https://stackoverflow.com/a/30258904/148412)

我遇到了同样的问题,只有这个解决方案对我有效(它在加载完整的DOM后运行一个函数)。我使用这个滚动锚后页面已加载:

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

                        // Your function that runs after all DOM is loaded

                    });

如果你想观察viewContentLoaded DOM对象的变化,然后做一些事情,你可以这样做。使用美元的范围。$on也可以,但不同的是,当你的路由是单页模式时。

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

如果你有一个特定于该页面的控制器,还有另一种选择:

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