zoukankan      html  css  js  c++  java
  • 利用Angular.js从PHP读取后台数据

    之前已经有非常多方法能够通过angular进行本地数据的读取。曾经的样例中,大多数情况都是将数据存放到模块的$scope变量中,或者直接利用ng-init定义初始化的数据。

    可是这些方法都仅仅为了演示其它功能的效果。这次来学习一下怎样将Angular和PHP相结合。从后台读取数据。

    首先,利用PHP,我们定义了一组后台数据,代码例如以下(test.php):

    <?

    php header("Access-Control-Allow-Origin: *"); header("Content-Type: application/json; charset=UTF-8"); $conn = new mysqli("myServer", "myUser", "myPassword", "Northwind"); $result = $conn->query("SELECT CompanyName, City, Country FROM Customers"); $outp = ""; while($rs = $result->fetch_array(MYSQLI_ASSOC)) { if ($outp != "") {$outp .= ",";} $outp .= '{"Name":"' . $rs["CompanyName"] . '",'; $outp .= '"City":"' . $rs["City"] . '",'; $outp .= '"Country":"'. $rs["Country"] . '"}'; } $outp ='{"records":['.$outp.']}'; $conn->close(); echo($outp); ?>

    这段代码含义比較简单,连接数据库后,从数据库中利用sql语句选择对应的数据($conn->query("SELECT CompanyName, City,Country FROM Customers"))。之后。利用循环结构,将取出的数据以键值对的形式保存在$outp变量中。


    接下来,在js中操作例如以下:

    <div ng-app="myApp" ng-controller="customersCtrl"> 
    <table>
      <tr ng-repeat="x in names">
        <td>{{ x.Name }}</td>
        <td>{{ x.Country }}</td>
      </tr>
    </table>
    </div>
    <script>
    var app = angular.module('myApp', []);
    app.controller('customersCtrl', function($scope, $http) {
        $http.get("test.php")
        .success(function (response) {$scope.names = response.records;});
    });
    </script>
    
    这里仍然应用了$http服务进行数据的读取。传入数据文件相应的url路径。成功后返回数据。并绑定到$scope.names变量上。



  • 相关阅读:
    iOS开发之Masonry框架源码解析
    iOS开发针对对Masonry下的FPS优化讨论
    React-native Android环境搭建
    Android中ListView使用总结
    Android开发布局方式
    轮播图
    大文件断点下载
    基于第三方库FMDB的数据库的二次封装
    md5加密
    AssignToObject文件(字典转模型、字典数组转模型数组)
  • 原文地址:https://www.cnblogs.com/yangykaifa/p/7357655.html
Copyright © 2011-2022 走看看