如何使用AngularJS控制器从Google App Engine获取数据,而不仅仅是从json文件获取数据

时间:2021-11-01 04:56:05

I am new to web dev and am trying to get data that has been inserted into a Google App Engine datastore and selectively post it onto a page using AngularJS. I am able to get Angular to work with a JSON file and can post the content of my app engine database using inline javascript on an html file, but I would like to do so using AngularJS. I tried to follow the tips listed on this page, but it seems to be missing information and doesn't explain where I should add "gapi.client.guestbook.messages. insert(message).execute();". I used objectify to annotate the api and java to write the new entity and api.

我是web dev的新手,我正在尝试获取已插入Google App Engine数据存储区的数据,并使用AngularJS选择性地将其发布到页面上。我能够让Angular使用JSON文件,并且可以在html文件上使用内联javascript发布我的app引擎数据库的内容,但我想使用AngularJS。我试着按照这个页面上列出的提示,但它似乎缺少信息,并没有解释我应该在哪里添加“gapi.client.guestbook.messages。insert(message).execute();”。我使用objectify来注释api和java来编写新的实体和api。

For example, the following code which references a json file in my program, works fine.

例如,以下代码在我的程序中引用json文件,工作正常。

listingControllers.controller('ViewItemsCtrl', [
                '$scope',
                '$routeParams',
                '$http',
                function($scope, $routeParams, $http) {
                    $http.get('phones/' + $routeParams.phoneId + '.json').success(
                            function(data) {
                                $scope.phone = data;
                                $scope.mainImageUrl = data.images[0];
                            });

                    $scope.setImage = function(imageUrl) {
                        $scope.mainImageUrl = imageUrl;
                    }
                    $('.dropdown-toggle').dropdown();
                } ]);

But when I try to make a controller to reference the Google datastore, I don't know exactly what to do. My best guess based on what I have researched is the following, but it's clearly not connecting to the database. If I do a simple get or insert call to the app engine without Angular, I first call function init() which loads gapi and calls getListings and insertListings. Do I need to do this in the controller? Here is my code which is partially based on this.

但是,当我尝试让控制器引用Google数据存储区时,我不确切知道该怎么做。根据我研究的内容,我的最佳猜测如下,但显然没有连接到数据库。如果我在没有Angular的情况下对app引擎进行简单的get或insert调用,我首先调用函数init()来加载gapi并调用getListings和insertListings。我需要在控制器中执行此操作吗?这是我的代码,部分基于此。

listingControllers.controller('datastoreTestCtrl', [
                    '$scope',
                    '$routeParams',
                    '$http',
                    function datastoreTestCtrl($scope) {
                      $scope.insertListing= function() {
                        message = {
                          "title" : $scope.title,
                          "price" : $scope.price
                        };
                      gapi.client.listingserviceapi.insertListing(message).execute()    
                      }

                    $scope.list = function() {
                        gapi.client.listingserviceapi.getListings().execute(function(resp) {
                        $scope.messages = resp.items;
                        $scope.$apply();
                      });
                    }


                      }
                    ]);

The following code is for the inline javascript that I can use to get and insert data from the datastore. I successfully used it to upload new data, but I can't seem to figure out how to use the inserted data on new pages. Thank you and please let me know if you know how to do this or can elaborate on the intro on the google web apps page.

以下代码用于内联javascript,我可以使用它来从数据存储区获取和插入数据。我成功地使用它来上传新数据,但我似乎无法弄清楚如何在新页面上使用插入的数据。谢谢,如果您知道如何操作,请告诉我,或者可以详细说明Google网络应用页面上的介绍。

<script type="text/javascript">
        function init() {
                //Parameters are APIName,APIVersion,CallBack function,API Root
                gapi.client.load('listingserviceapi', 'v1', null, 'https://molt-team-233.appspot.com/_ah/api');

                document.getElementById('getListings').onclick = function() {
                    getListings();
                  }
                  document.getElementById('insertListing').onclick = function() {
insertListing(); 
}
        }

        //List Quotes function that will execute the list call
        function getListings() {
                gapi.client.listingserviceapi.getListings().execute(function(resp) {
                        if (!resp.code) {
                                resp.items = resp.items || [];
                                var result = "";
                                for (var i=0;i<resp.items.length;i++) {
                                        result = result+ resp.items[i].title + "..." + "<b>" + resp.items[i].description + "</b>" + "[" + resp.items[i].price + "]" + "<br/>";
                                }
                                document.getElementById('getListingsResult').innerHTML = result;
                        }
                });
        }
        //Insert function
function insertListing() {
//Validate the entries
var _title = document.getElementById('title').value;
var _price = document.getElementById('price').value;

//Build the Request Object
var requestData = {};
requestData.title = _title;
requestData.price = _price;

gapi.client.listingserviceapi.insertListing(requestData).execute(function(resp) {
if (!resp.code) {
//Just logging to console now, you can do your check here/display message
console.log(resp.id + ":" + resp.author + ":" + resp.message);
}
});
}

    </script>
<script src="https://apis.google.com/js/client.js?onload=init"></script>

1 个解决方案

#1


0  

There's no difference from the point of view of your Angular code whether the data comes from JSON or the datastore. The difference is in your server-side code: you need to write a method in your GAE app that responds to a request, queries the datastore, builds a JSON blob and returns it.

从Angular代码的角度来看,数据来自JSON还是数据存储区没有区别。不同之处在于服务器端代码:您需要在GAE应用程序中编写一个响应请求的方法,查询数据存储区,构建JSON blob并返回它。

The tutorial you're referencing is an attempt to abstract some of that away by using GAE Cloud Endpoints. But that still needs quite a bit of setup at the server side, and it's not really necessary if all you want to do is return some JSON.

您引用的教程试图通过使用GAE Cloud Endpoints来抽象其中的一些内容。但是在服务器端仍然需要相当多的设置,如果你想要做的就是返回一些JSON,这并不是必需的。

#1


0  

There's no difference from the point of view of your Angular code whether the data comes from JSON or the datastore. The difference is in your server-side code: you need to write a method in your GAE app that responds to a request, queries the datastore, builds a JSON blob and returns it.

从Angular代码的角度来看,数据来自JSON还是数据存储区没有区别。不同之处在于服务器端代码:您需要在GAE应用程序中编写一个响应请求的方法,查询数据存储区,构建JSON blob并返回它。

The tutorial you're referencing is an attempt to abstract some of that away by using GAE Cloud Endpoints. But that still needs quite a bit of setup at the server side, and it's not really necessary if all you want to do is return some JSON.

您引用的教程试图通过使用GAE Cloud Endpoints来抽象其中的一些内容。但是在服务器端仍然需要相当多的设置,如果你想要做的就是返回一些JSON,这并不是必需的。