我的离子登录应用程序出现问题

时间:2017-03-30 23:21:49

标签: angularjs ionic-framework

我正在尝试使用创建帐户选项创建登录应用程序。当我运行离子服务时,我得到一个白色屏幕。 到目前为止,我已经完成了代码 (我对这个东西很新)

的index.html

<body ng-app="starter">

  <ion-nav-view></ion-nav-view>

  </body>

的login.html

<ion-view>
 <ion-content>

  <div class="login-image">
     <img src="../img/img3.jpg" width="100%" class="padding">
   </div>

   <div class="padding">  
    <form ng-submit="doLogin()" >
        <div class="list">
          <label class="item item-input">
            <span class="input-label"></span>
            <input type="text" ng-model="loginData.username" placeholder="Username">
          </label><br>
          <label class="item item-input">
            <span class="input-label"></span>
            <input type="password" ng-model="loginData.password" placeholder="Password">
          </label><br>
           <div style=" text-align: right;">
             <a href="#/"> Forgot Password </a>
           </div><br>
          <label>
            <button class="button button-block button-positive" type="submit" href = "template/dashboard.html">Log in</button>
          </label>
          <br>
           <div style=" text-align: center;">
             <a href="template/createaccount.html">Create Account</a>
           </div>
        </div>
      </form>
   </div>

 </ion-content>
</ion-view>

createaccount.html

<ion-view>
  <ion-content>
    <div>
      <form name="createaccountform" class="padding">
        <div>
            <label class="item item-input item-floating-label">
                <span class="input-label">First Name</span>
                <input type="text" name="firstname" placeholder="First Name">
            </label>
            <label class="item item-input item-floating-label">
                <span class="input-label">Last Name</span>
                <input type="text" name="lastname" placeholder="Last Name">
            </label>
            <label class="item item-input item-floating-label">
                <span class="input-label">Email</span>
                <input type="email" name="email" placeholder="Email">
            </label>
            <label class="item item-input item-floating-label">
                <span class="input-label">Username</span>
                <input type="text" name="Username" placeholder="Username">
            </label>
            <label class="item item-input item-floating-label">
                <span class="input-label">Password</span>
                <input type="password" name="password" placeholder="Password">
            </label>
            <label>
             <button class="button button-block button-positive" type="submit" href="template/login.html">Create Account </button> 
           </label>         
        </div>      
      </form>
    </div>
  </ion-content>
</ion-view>

app.js

.config(function($stateProvider,$urlRouterProvider){
  $stateProvider

    .state('index',{
      url: '/index',
      abstract: true,
      templateUrl: '/index.html'

       })

    .state('login',{
      url: '/login',
      templateUrl: 'templates/login.html'
    }) 

    .state('createaccount',{
      url: '/createaccount',
      templateUrl: 'templates/createaccount.html'
    });




    //allows for fallback when page not found or not exist
    $urlRouterProvider.otherwise('templates/login.html');

});

不知道是什么错了,但我真的需要一个指南。

1 个答案:

答案 0 :(得分:0)

运行命令后,需要访问以下URL以查看登录页面:

http://localhost:8000/login

路由在整个州经理的app.js文件中处理。 我建议您查看official documentation以了解其工作原理。