首页 > 解决方案 > AngularJS 1.2双击需要更改视图

问题描述

我有一个负责渲染新闻页面的控制器。地址栏不显示视图的变化,我想通过在控制器中包含以下代码来修复它:

$location.search({pageNr: this.searchOptions.pageNr, pageSize: this.searchOptions.pageSize});

它工作正常,现在我在地址栏中有链接:http://localhost:83/news-page/news?pageNr=3&pageSize=8

但是,有一个问题:视图的内容只有在第二次点击后才会发生变化!我必须在分页页面 nr 上单击两次才能更改内容,而第一次单击后 url 会更改。问题可能出在哪里?

angular.module("News")
    .controller("news.search", NewsController);

NewsSearchController.$inject = ['leftsidemenu', 'category', 'RequestNews', 'forbiddenService', 'urlParams', '$location', '$rootScope'];
function NewsSearchController(leftsidemenu, category, RequestNews, forbiddenService, urlParams, $location, $rootScope) {
    var controller = this;

    /**
     * Default search options
     *
     * @type {{sort: string, pageNr: number, pageSize: number}}
     */
    var defaultSearchOptions = {
        "sort": "",
        "pageNr": 1,
        "pageSize": 8,
        "categoryId": category.id,
        "filter": {
            "keyword": "",
            "donors": [],
            "countries": [],
            "sectors": [],
            "postedYear": ""
        }
    };

   function onPageSelect(page) {
        controller.searchOptions.pageNr = page;
        //urlParams.setUrlParams({pageNr: controller.searchOptions.pageNr, pageSize: controller.searchOptions.pageSize}, defaultSearchOptions);
        $location.search({pageNr: this.searchOptions.pageNr, pageSize: this.searchOptions.pageSize});

        controller.search();
    }

HTML - 调用 onPageSelect

<div class="col-xs-12">
    <da-pagination total-items="searchPosts.totalItems"
                   page-size="searchPosts.searchOptions.pageSize"
                   max-pages="8"
                   current-page="searchPosts.searchOptions.pageNr"
                   select="searchPosts.onPageSelect(page)"
                   hide-per-page-numbers
                   repaginate-flag="searchPosts.refreshPagination">
    </da-pagination>
</div>

标签: javascriptangularjs

解决方案


推荐阅读