Question

我正在开发一个项目，当用户点击两个按钮选项中的任何一个时，用户将被定向到具有相应注册表单的新页面。我是前端开发人员，因此在服务器端非常缺乏经验。我猜我需要节点路由来完成这个，但不知道如何做到这一点。目前，当用户单击按钮时，我使用ng-view指令加载新的注册页面。但就像我说的，这不是我想要的，因为当注册表单出现时，2个按钮和原始问题仍然出现，这不是我想要的。我可以使用ng-hide和ng-show但我决定不这样做，因为我希望将用户定向到显示注册表单的新页面。我的主页是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>

我的角度应用或redirect.js看起来像这样：

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是屏幕注册表单。如果有人想看到它们，我可以提供这些文件。请提供一些示例代码，以便我可以看到正在发生的事情。感谢大家的帮助，我非常感谢。此致 Node Clueless

Answer 1

在简单的页面webapp中，路由部分在前面处理（例如示例中的Angular）。 NodeJS不处理路由问题，但是提供REST API接口。

所以你想要的只是配置你的var arr = []; var fruits = ['banana', 'apple', 'mango']; var label = 'Fruits'; for (var i = 0; i < fruits.length; i++) { var obj = {}; obj['data'] = fruits[i]; obj['label'] = label; arr.push(obj); }。因为我注意到在路由提供程序配置中，每个子页面都没有控制器。也许你可以从这一点开始？

如何使用ngRoute进行路由？

1 个答案: