AngularJS工作原理--举例说明

在研究了angularjs接近半年的时间以后，终于差不多弄懂了angularjs的工作机制原理了：

拿一个例子说明一下吧：

HTML代码：

<ion-list>

            <div style="margin-top: 44px;"></div>

            <ion-item ng-repeat="item in items"

                      item="item"

                      ng-click="goToDetail(item)"

                      class="item-remove-animate" style="height: 65px;vertical-align: middle;padding-top: 1px;">

                    <div style="width: 100%;" class="warp">

                        <div style="font-size:16px;width: 100%;float:left;color: #000000;padding-top: 15px;">{{ item.OF_OFFICENAME }}    <span style="color: #9b9b9b;">容纳{{ item.OF_MAXUSER  }}人</span>   <span style="color:#5077aa">已预订：{{}}次</span></div>

                        </div>

                    <!--</div>-->

                </div>

            </ion-item>

        </ion-list>

conroller.js代码：

  listFactory.getOffice(remindtime).then(function (response) {

            console.log(response);

            $scope.items = response;

        });

service.js代码：

getOffice: function getList(date) {

                var deferred = $q.defer();

                var params = "{\"date\":\""+date+"\"}";

                var url = '/serv?domain=getOffice¶ms=' + encodeURIComponent(params);

                $http.post(url).success(function (response) {

                    deferred.resolve(response);

                }).error(function (data) {

                    console.log("getList网络联接失败!");

                    $ionicPopup.alert({

                        title: '<b>错误!</b>',

                        template: '网络联接失败!'

                    })

                    deferred.reject();

                });

                return deferred.promise;

            },

首先在service.js中定义一个方法叫
4000
getOffice，该方法是与后台数据库进行数据查询的接口，在前台页面能够显示出来数据的流程是首先在service里面写一个查询的方法，当页面需要显示容纳人数和预定次数时先调用对应的controller，然后会调用到 listFactory.getOffice，listFactory是controller
调用service方法的函数，点后面跟的是service里面定义的与数据库交互的方法名，response 则是后台数据库返回给前端的数据集合。最后你用一个循环把需要的数据遍历出来就大功告成啦~~~~~