访问后台数据库有多6，看看这里便知

相信使用爱码哥的小伙伴们对原生控件已经很熟悉了，在app开发中，原生控件能够帮助开发人员完成一个个精美的页面，给app奠定一个好的基础。然而，完成这些美观的静态页面只是开发app的开始，页面的交互和调用程度、用户体验和流畅的性能才是app的重中之重。这些与脚本功能息息相关，比如界面数据都是来自数据库的动态数据，用户输入的数据能够以同步和异步的方式入库，这些都需要JavaScript脚本来完成。 
 
下面我们一起学习iMAG客户端访问后台数据库的两种方式。 
 
通过后台程序读取数据库数据，再用JSP（需要部署Java本地开发环境），ASP（需要部署.Net本地开发环境）等脚本输出iMAG标签，这种方式类似于动态网页。如：
 

<?xml version="1.0" encoding="utf-8"?>
<imag>
    <page>
        <title>
            <center><label><%=title%></label></center>
        </title>
        <content>
            <list>
            <%for (int i = 0; i < items.length; i++) {%>
                <item accessory="indicator" href="<%=items[i][0]%>">
                    <label><%=items[i][1]%></label>
                </item>
            <%}%>
            </list>
        </content>
    </page>
</imag>

上面的例子通过JSP输出iMAG页面，title和items都是来自数据库的数据。
 
另一种方式是通过$http.get() 和$http.post()方法来获取服务器端的数据，这种方式类似于Ajax。

<imag>  
    <script>
    <![CDATA[
        $page.onload = function() {
            $http.get('http://www.imagapp.com/download/data/ajax_test.json', function(data) {
                var obj = JSON.parse(data);
                $('title').text = obj.title;
                var listXml = '<list>';
                for (var i = 0; i < obj.items.length; i++) {
                    listXml += '<item  accessory="indicator" href="' + obj.items[i][0] + '">' +
                                    '<label>' + obj.items[i][1] + '</label>' +
                               '</item>';
                }
                listXml += '</list>';
                $('data_list').update(listXml);
            });
        }
    ]]>
    </script>
    <page>
        <title>
            <center><label id="title"></label></center>
        </title>
        <content>
            <list id="data_list">
            </list>
        </content>
    </page>
</imag>

 
上面的例子通过http请求方式加载数据，obj.title和obj.items都是来自远程服务器的JSON数据。JSON数据可以在云平台的模拟数据中创建。 

爱码哥邀你一起智造app！