角Js链接到部分页面
我正在开发一个单一页面的移动web应用程序使用角。
第一次加载partial-For-routes-1.html时，我想通过使用链接访问partial-For-routes-2.html和partial-For-routes-3.html，如何提供到页-2和页-3的链接，使用下面使用的href更好还是使用ng-href更好？
在普通桌面web应用程序中，我们只需使用要加载到href属性中的页面的相对路径即可。我不知道如何在带有部分的角度js框架中这样做。请帮我这个忙。提前谢谢。
请纠正我使用正确的语法链接到部分。
Index.html
<html lang="en" ng-app="myApp">
<head>
<meta charset="utf-8">
<title>My HTML File</title>
<title>Google Phone Gallery</title>
<link rel="stylesheet" href="css/app.css">
<link rel="stylesheet" href="css/bootstrap.css">
<script src="lib/angular/angular.js"></script>
<script src="js/controllers.js"></script>
<script src="js/routes.js"></script>
</head>
<body ng-controller="appCtrl">
<div class="" ng-view></div>
</body>
</html>app.js
angular.module('myApp', []).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/',
{
templateUrl: 'partials/partial-For-routes-1.html',
controller: appCtrl
}).
when('/page-2',
{
templateUrl: 'partials/partial-For-routes-2.html',
controller: appCtrl
}).
when('/page-3',
{
templateUrl: 'partials/partial-For-routes-3.html',
controller: appCtrl
}).
otherwise({redirectTo:("/")})
}]);partial-For-routes-1.html
<p>Total number of phones: 1</p>
<p>Total number of phones: 1</p>
<p>Total number of phones: 1</p>
<p>Total number of phones: 1</p>
<p>Total number of phones: 1</p>
<p>Total number of phones: 1</p>
<p><a href="#/page-2" class="">Go to Page 2</a></p>
<p><a href="#/page-3" class="">Go to Page 3</a></p>partial-For-routes-2.html
<p>Total number of phones: 2</p>
<p>Total number of phones: 2</p>
<p>Total number of phones: 2</p>
<p>Total number of phones: 2</p>
<p>Total number of phones: 2</p>
<p>Total number of phones: 2</p>
<p><a href="#/page-1" class="">Go to Page 1</a></p>
<p><a href="#/page-3" class="">Go to Page 3</a></p>partial-For-routes-3.html
<p>Total number of phones: 3</p>
<p>Total number of phones: 3</p>
<p>Total number of phones: 3</p>
<p>Total number of phones: 3</p>
<p>Total number of phones: 3</p>
<p>Total number of phones: 3</p>
<p><a href="#/page-1" class="">Go to Page 1</a></p>
<p><a href="#/page-2" class="">Go to Page 2</a></p>回答 1
Stack Overflow用户
发布于 2013-05-06 13:39:34
我想你要找的是：
.when('/page/:id',
{
templateUrl: 'partials/partial-For-routes.html',
controller: appCtrl
})您也可以这样做路由，并且它的工作原理是一样的：
.when('/page-:id',
{
templateUrl: 'partials/partial-For-routes.html',
controller: appCtrl
})在您的appCtrl中，您将读取路由值以确定页面。这允许您用一个视图处理一个控制器内的所有分页。
在您的控制器中，这是可用的，因此您可以根据动态路由值处理分页：$routeParams.id。
您的链接将是href='#/page/1'，或者根据您的说明，它们可以类似于这个href='#/page-1'，这取决于您如何定义规则。
下面是一个演示：http://plnkr.co/edit/a2qaF0rAAgI5UMCY6RcO?p=preview
以下是全屏链接，如果您想更好地查看路由更改：http://plnkr.co/a2qaF0rAAgI5UMCY6RcO
https://stackoverflow.com/questions/16399685
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号