页面路由不完全符合我的预期 [英] Page routing not exactly how I intended
问题描述
我下面有以下代码，其中我使用角路由"将用户定向到新的注册表单.该应用程序的工作原理是这样的.用户看到一个网页，该网页要求他们通过单击适当的按钮在数字报价"或屏幕报价"之间做出选择.单击该按钮后，应将其定向到另一个页面，该页面显示相应的注册表格.就不同的注册表格而言，我拥有了所有这些内容.但是在功能方面，我有一个大问题.当用户单击按钮时，应该将注册加载到其他页面.我不确定该怎么做.是的，我使用的是ng-view指令，这意味着按钮和初始问题仍然存在.我的目标是，一旦单击该按钮，您看到的就是相应的/不同的注册页面.任何帮助或指示，将不胜感激.我不相信Angular可以解决这个问题. 谢谢 主页-> index.html
I have following code below where I used Angular Routing to direct users to new registration forms. The app works like this. The user sees a webpage which asks them to make a choice between a "digital quote" or "screen quote" by clicking the appropriate button. Once the button is clicked it should direct it to another page which shows the appropriate registration form. In terms of the different registration forms, I have that all built. But I have one big problem in terms of functionality. When the user clicks the button it should load the registration in a different page. I am not sure how to do that. Right not I am using an ng-view directive which means that the buttons and the initial questions still remain. My objective is that once you click the button, all you see are the corresponding/different registration pages. Any help or direction would be greatly appreciated. I don't believe Angular can solve this. Thank you the main page-> index.html
<html ng-app="myHome">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Home Page</title>
<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.5/css/bootstrap.min.css" />
<link rel="stylesheet" href"https://cdnjs.cloudflare.com/ajax/libs/ng-table/0.8.3/ng-table.min.css"/>
<link rel="stylesheet" href="/css/redirect.css"/>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.1.4.min.js"> </script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script><!--This is to call Angular JS-->
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular-route.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.5/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ng-table/0.8.3/ng-table.min.js"></script>
<script src="/js/redirect.js"></script>
</head>
<body>
<div class="container">
<div class="row" id="rotate">
<div class="col-md-6 col-md-offset-3">
<img src="/css/Logo_75.png">
</div>
</div>
<div class="row">
<h1>WHAT TYPE OF QUOTE ARE YOU REQUESTING:</h1><br>
<h1>DIGITAL OR SCREEN QUOTE?</h1>
</div>
<div class="row">
<div class="col-md-6 col-md-offset-3">
<button type="button" class="btn btn-success"><a href="#/digital">DIGITAL QUOTE</a></button>
<button type="button" class="btn btn-success"><a href="#/screen">SCREEN QUOTE</a></button>
</div>
</div>
</div>
<div class="container">
<div ng-view></div>
</div>
</body>
Angular JS文件或redirect.js文件看起来像这样:
The angular JS file or the redirect.js file looks like this:
var app = angular.module('myHome', [ngRoute]);
.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/', { templateUrl: '/index.html' })
.when('/digital', { templateUrl: '/digital.html' })
.when('/screen', { templateUrl: '/screen.html' })
.otherwise({ redirectTo: '/' });
}]);
其中digital.html是数字选项的注册表单，而screen.html是屏幕注册表单选项.如果有人想查看这些注册表格，我也可以粘贴这些文件.非常感谢你的帮助.
where digital.html is the registration form for the digital option and screen.html is the screen registration form option. If anyone wants to see those registration forms, I can paste those files as well. Thank you so much for your help.
推荐答案
当用户单击按钮时，应将注册内容加载到 不同的页面
When the user clicks the button it should load the registration in a different page
可能您可以通过以下方式解决它.
Probably you can solve it in the next way.
只需单击按钮，即可从服务器上单击新页面.(从href =#/digital"中删除#)，然后在服务器端应用程序中创建新的路由(/数字).
Just get on button click new page from server.(remove # from href="#/digital") and create new route(/digital) in your server side application.
这篇关于页面路由不完全符合我的预期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
