为什么我的angularJS登录表单视图不显示？

出于某种原因，我的index.html中的视图根本不会显示我的login.html视图。可能是路由问题。我真的不明白如何使用路由，但我认为我做对了。为什么我的angularJS登录表单视图不显示？

的index.html

评论：

中的index.html将举行名为应用NG-应用程序，我将切换视图这取决于我的应用程序正在做的事情。默认情况下，这个想法总是在该视图底部显示一条消息来显示登录屏幕（view：login.html），以链接到注册视图（view：register.html）。用户登录后，视图将更改为显示聊天消息收件箱的用户屏幕（这尚未实现，但我希望获得一些建议，因为我刚开始使用angularJS）。如果用户点击注册链接将用户带到注册视图（view：register.html），他们将有机会注册。

目前我的问题是，当我浏览到https://linus.highpoint.edu/~tferguson/research_project/app/

<!DOCTYPE html> 
<html ng-app="app"> 
    <head> 
     <script src="../angular-1.5.8/angular.js"></script> 
     <script src="../angular-1.5.8/angular-route.js"></script> 
     <script src="controller.js"></script> 
    </head> 
    <body> 
     <div id="header"> 
     <h1>My AngularJS App</h1> 
     </div> 
     <div id="mainBody"> 
     <h1>Body of AngularJS App</h1> 
     <div ng-view> 
      <!-- 
       The login view will be here by default to force login. 
       login.html holds this form. 

       Once user provides a valid login, I want the view to 
       change to an inbox for messages for a chat app between 
       users that can register and stored in a database accessed 
       through php. 
       Still working on this part. 
      --> 
     </div> 
     </div> 

     <div id="footer"> 
     </div> 
    </body> 
</html>

login.html的登录表单视图不会自动显示

评论：

这种观点应该是默认的显示index.html ng-view div。但它不，我怀疑这是因为我的controller.js文件，我可能会路由不正确。

<div id="login" ng-controller="loginCtrl"> 
    <form name="loginForm"> 
     Username: <input type="text" name="username" id="username" ng-model="user.username" required=""/> 
     <br /> 
     <div ng-show="loginForm.$submitted || loginForm.username.$touched"> 
     <span ng-show="loginForm.username.$error.required">Enter your username/email.</span> 
     <span ng-show="loginForm.username.$error.email">This is not a valid email.</span> 
     </div> 
     Password: <input type="password" name="password" id="password" ng-model="user.password" required=""/> 
     <br /> 
     <div ng-show="loginForm.$submitted || loginForm.password.$touched"> 
     <span ng-show="loginForm.password.$error.required">Enter your password.</span> 
     </div> 
     <button type="submit" ng-click="checkLogin()">Login</button> 
     <span>{{ loginMsg }}</span> 
    </form> 
    <a href="#register">Register</a> 
</div>

register.html

评论：

大概没有neccesary表明这个观点，但我认为它可以帮助提供有关我的应用程序应该究竟如何工作的一些背景。

<div id="register" ng-controller="registerCtrl"> 
    <form name="registerForm"> 
     First Name: <input type="text" name="FirstName" id="FirstName" ng-model="new_user.FirstName" required=""/> 
     <br /> 
     <div ng-show="registerForm.$submitted || registerForm.FirstName.$touched"> 
     <span ng-show="registerForm.FirstName.$error.required">Enter your First Name.</span> 
     </div> 

     Last Name: <input type="text" name="LastName" id="LastName" ng-model="new_user.LastName" required=""/> 
     <br /> 
     <div ng-show="registerForm.$submitted || registerForm.LastName.$touched"> 
     <span ng-show="registerForm.LastName.$error.required">Enter your username/email.</span> 
     </div> 

     Username(Your Email): <input type="text" name="Email" id="Email" ng-model="new_user.Email" required=""/> 
     <br /> 
     <div ng-show="registerForm.$submitted || registerForm.Email.$touched"> 
     <span ng-show="registerForm.Email.$error.required">Enter your username/email.</span> 
     <span ng-show="loginForm.Email.$error.email">This is not a valid email.</span> 
     </div> 

     Password: <input type="password" name="Pass" id="Pass" ng-model="new_user.Pass" required=""/> 
     <br /> 
     <div ng-show="registerForm.$submitted || registerForm.Pass.$touched"> 
     <span ng-show="registerForm.Pass.$error.required">Enter your password.</span> 
     </div> 

     Confirm Password: <input type="password" name="Pass2" id="Pass2" ng-model="new_user.Pass2" required=""/> 
     <br /> 
     <div ng-show="registerForm.$submitted || registerForm.Pass2.$touched"> 
     <span ng-show="registerForm.Pass2.$error.required">Confirm your password.</span> 
     </div> 
     <button type="submit" ng-click="register()">Register</button> 
     <span>{{ registerMsg }}</span> 
    </form> 
    <a href="#login">Login</a> 
</div>

controller.js

评论：

我想我的路由是不正确这里。我还是新来的angularJS，希望我能得到一些帮助，我做错了什么，以及如何解决它。在我的控制器中，我还更改了$位置，所以这也可能是一个嫌疑犯。其他可疑的代码部分将是login.html和register.html视图底部的链接。基本上怀疑我拨弄路由和位置的任何东西。

希望我是对的。

来源

2016-11-11 xTaylorFerg

relace这

.otherwise({ redirectTo: "/index.html" });

与此，

.otherwise({ redirectTo: "/" });

，因为您的登录路径为 “/” 而不是 “index.html”

来源

2016-11-11 05:23:52

不幸的是这没有奏效。 :(任何其他想法？ – xTaylorFerg

为什么我的angularJS登录表单视图不显示？

回答

相关问题