使用Ionic Framework开发移动应用程序。
我知道它的基本问题,但我是新手。
在yum install openssl-devel
中有两个按钮1用于Index.html
,另一个用于Login
的index.html
SignUp
登录时点击它打开 <script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/directives.js"></script>
<script src="js/services.js"></script>
<script src="js/routes.js"></script>
</head>
<body ng-app="starter" ng-controller="MainCtrl">
<ion-pane>
<div class="bar bar-header bar-calm">
<h1 class="title">Heading</h1>
</div>
<ion-content paging="true" class="has-header" >
<div>
<img src="img/Logo.jpg" width="100%" height="auto" style="display:block;margin-left:auto;margin-right:auto;" />
<img src="img/Team.jpg" width="70%" height="auto" style="display:block;margin-left:auto;margin-right:auto;" />
</div>
<div ng-cntroller="loginCtrl">
<button id="btnLogin" class="icon icon-right ion-log-in left button button-positive button-block " style="border-radius:15px 15px 15px 15px;" ng-click="login()">Login</button>
</div>
<div ng-cntroller="signupCtrl">
<button id="btnSignUp" class="button button-positive button-block icon icon-right ion-person left" style="border-radius:15px 15px 15px 15px;">SignUp</button>
</div>
<div class="bar bar-footer bar-calm">
<div class="title">Copyright <strong>@</strong></label>
</div>
</ion-content>
</ion-pane>
页面,点击注册打开Login.html
app.js
Signup.html
routes.js
angular.module('starter', ['ionic','starter.controllers','starter.routes','starter.services','starter.directives'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
if(cordova.platformId === 'ios' && window.cordova && window.cordova.plugins.Keyboard) {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
// Don't remove this line unless you know what you are doing. It stops the viewport
// from snapping when text inputs are focused. Ionic handles this internally for
// a much nicer keyboard experience.
cordova.plugins.Keyboard.disableScroll(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
})
controllers.js
var app = angular.module('starter', [])
app.config(function($stateProvider,$urlRouteProvider){
$stateProvider
.state('text', {
url: '/page1',
templateUrl: 'templates/text.html',
controller: 'textCtrl'
});
.state('login', {
url: '/page2',
templateUrl: 'templates/login.html',
controller: 'loginCtrl'
});
.state('signUp', {
url: '/page3',
templateUrl: 'templates/signup.html',
controller: 'signupCtrl'
});
.state('chats', {
url: '/page4',
templateUrl: 'templates/chats.html',
controller: 'chatsCtrl'
});
$urlRouteProvider.otherwise('/page1')
});
的login.html
var app = angular.module('starter')
app.controller('textCtrl',function($scope){
});
app.controller('loginCtrl', function ($scope) {
$scope.login = function(){
alert("Hi")};
});
app.controller('signUpCtrl', function ($scope) {
});
app.controller('chatsCtrl', function ($scope) {
});
答案 0 :(得分:0)
您需要定义登录按钮应该执行的操作。两种方法
要么
<button id="btnLogin" ui-sref="login">Login</button>
或者按下按钮(例如
)来执行此操作$scope.login = function(){
$state.go('login');
};
确保将$ state注入您的控制器。
答案 1 :(得分:0)