从HTML离子APP数据PHP服务器(Ionic app data from html to php

2019-10-23 08:11发布

我是新来的离子框架和我在努力发布数据从HTML到PHP。

1.index.html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->


    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>
  <script src="js/ng-cordova.min.js"></script>
    <!-- cordova script (this will be a 404 during development) -->
    <script src="cordova.js"></script>


    <!-- your app's js -->
    <script src="js/app.js"></script>
  </head>
  <body ng-app="starter">

    <ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">HTML</h1>
      </ion-header-bar>

      <ion-view title="Signup">
     <ion-nav-buttons side="left">
      <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
    </ion-nav-buttons>

    <ion-content class="has-header">
      <div class="list list-inset">

       <label class="item item-input">
         <input class="form-control" type="text" ng-model="userdata.username" placeholder="Enter Username">
       </label>

       <label class="item item-input">
         <input type="text" ng-model="userdata.email" placeholder="Enter Your Email">
       </label>

       <label class="item item-input">
         <input class="form-control" type="password" ng-model="userdata.password" placeholder="Enter Your Password">
       </label>

       <button class="button button-block button-positive button-dark" ng-click="signUp(userdata)">SignUp</button><br>
       <span>{{responseMessage}}</span>
     </div>
    </ion-content>

  </ion-view>
    </ion-pane>
  </body>
</html>
  1. app.js:

     .controller('SignupCtrl', function($scope, $http) { $scope.signup = function () { var request = $http({ method: "post", url: "http://myurl.com/signup.php", crossDomain : true, data: { email: $scope.email, password: $scope.password, username: $scope.username }, headers: { 'Content-Type': 'application/x-www-form-urlencoded' } }); /* Successful HTTP post request or not */ request.success(function(data) { if(data == "1"){ $scope.responseMessage = "Successfully Created Account"; } if(data == "2"){ $scope.responseMessage = "Create Account failed"; } else if(data == "0") { $scope.responseMessage = "Email Already Exist" } }); } }) 

3.PHP文件:

<?php
        header("Content-Type: application/json; charset=UTF-8");
        header('Access-Control-Allow-Origin: *');
        header('Access-Control-Allow-Methods: GET, POST');

        $postdata = file_get_contents("php://input");
        $request = json_decode($postdata);
        $email = $postdata->email;
        $password = $postdata->password;
        $username = $postdata->username;

        $con = mysql_connect("localhost","username",'password') or die ("Could not connect: " . mysql_error());;
        mysql_select_db('dbname', $con);

        $qry_em = 'select count(*) as cnt from users where email ="' . $email . '"';
        $qry_res = mysql_query($qry_em);
        $res = mysql_fetch_assoc($qry_res);

        if($res['cnt']==0){
        $qry = 'INSERT INTO users (name,pass,email) values ("' . $username . '","' . $password . '","' . $email . '")';
        $qry_res = mysql_query($qry);
            if ($qry_res) {
                echo "1";
            } else {
                echo "2";;
            }
        }
        else
        {
            echo "0";
        }
        ?>

Answer 1:

编辑:我写了一篇关于如何从离子数据公布至PHP中的详细说明,你可以查看这里 。

index.html文件,你必须:

ng-click="signUp(userdata)

但随后在app.js文件,你有这样的:

$scope.signup = function () {

而不是这样的:

$scope.signup = function (userdata) {

如果你会走这条路,那么你的数据应该是这样的:

data: {
        email: userdata.email,
        password: userdata.password,
        username: userdata.username
}

不过 ,你不必做这个样子! 你可以不喜欢它,让你删除userdatang-click="signUp(userdata) ,然后在你做这样的数据部分的app.js文件:

data: {
        email: $scope.userdata.email,
        password: $scope.userdata.password,
        username: $scope.userdata.username
}


文章来源: Ionic app data from html to php server