Javascript 使用UI路由器分页时如何更改URL？

我有一个使用Angular UI Router的Angular JS项目，进展很顺利，但我正在尝试实现UI引导分页指令，无法制定正确的策略

我有一个一次显示一页的数据表，我有分页指令，显示正确的页面链接数。当您单击一个链接时，它将获得新的页码，并对api进行重新启动调用，以获取新记录并将它们绑定到表中

这一切都很好，但很明显，当你浏览数据时，URL不会改变，因此用户不能使用浏览器的后退/前进按钮来浏览他们的历史记录。理想情况下，我希望使用以下URL：

/contacts
/contacts/page-2
/contacts/page-3

我也想包括在URL排序，但这是另一个问题

我可以做到这一点，但当单击其中一个分页按钮时，手动转换到一个新状态，但这将重新加载控制器及其所有内容，对服务器进行额外的ajax调用，并在重新创建分页控件时使未设置样式的内容丑陋地闪烁，等等

理想情况下，我可以更改URL并添加历史记录状态，但不会触发实际状态更改并重新加载/运行该视图的控制器。我甚至不确定这是否可能，更不用说如何做到了

---

有人有什么想法吗？

这很容易用$stateparms实现

比如说

$stateProvider
.state('contacts',{
 url: '/contacts',
 templateUrl: 'contacts.html'
}).state('contacts.paginated', {
    url: "/contacts/page-:pageNum",
    templateUrl: 'contacts.html',
    controller: function ($stateParams) {
        // If we got here from a url of /contacts/page-2
        expect($stateParams).toBe({pageNum: 2});
    }
})

不过，我会选择不同的分页方案 /contacts/page/1或/contacts？page=1

---

这两个都可以通过ui路由器轻松实现

谢谢Vladimir，但也许我的问题还不够清楚。您的解决方案显示了如何设置路由器来处理用于分页的URL，但我的问题是如何在控制器内进行分页并更新URL，而无需实际重新加载/重新运行控制器逻辑。在这种情况下，如果您重复使用相同的状态，例如“contacts.paginated”，只需更改状态参数，模板将被缓存，您只需要基于$stateParams数据获取新数据。我看不出这怎么会引起闪光。不，在这种情况下，控制器不会重新初始化，因此如果我使用相同的状态（contacts.paginated）并更改$stateParams，地址栏中的URL是否会更改并允许浏览器历史运行？您可能需要使用$state.go（'contacts.paginated'，{pageNum:2}）为了更新与此状态关联的$stateParams，我仅在参数更改时更新结果，并使用$scope.$watchCollection（“$stateParams”）检测何时发生更改，从而解决了此问题。使用浏览器的“后退”按钮时，此功能也有效。谢谢你的帮助。