Question

我正在研究一些自学AngularJS的东西，而且我正在运行双向数据绑定问题。我现在已将其设置为从数据库中获取信息。

当我调用链接时，我会从数据库中收到信息。我首先搜索用户。在这种情况下，我搜索了Juana Castillo。

localhost:8080/api/person?name=Juana+Castillo

在“搜索”Juana Castillo之后返回的信息如下：

{
    "count": "1", 
    "input": null, 
    "results": {
        "DateOfBirth": "12/24/1999", 
        "secPosition": "Goalkeeper", 
        "ACT": "20", 
        "Email": "jcastillo@fake.com", 
        "ParentApproval": 0, 
        "Views": "/trunk/files/f00000.txt", 
        "EmailConfidential": 1, 
        "Address": "2 Av. Pres. Castelo Branco, Rio de Janeiro, Brazil", 
        "SAT": "900", 
        "Name": "Juana Castillo", 
        "Level": "Amateur", 
        "CountryPlayingIn": "Brazil", 
        "GPA": 3.5, 
        "Graduation": "May 2016", 
        "priPosition": "Goalkeeper", 
        "Gender": "F", 
        "PhoneNumber": "55 800 062 7222", 
        "Citizenship": "Brazilian", 
        "Links": "/trunk/files/f00000.txt", 
        "Videos": "/trunk/files/f00000.txt", 
        "FieldOfStudy": "/trunk/files/f00003.txt", 
        "Committed": "/trunk/files/f00000.txt", 
        "Sport": "Soccer", 
        "TOEFL": "28"
    }, 
    "method": "GET", 
    "kwargs": {
        "name": "Juana Castillo"
    }
}

我的问题是，在获取此信息后，人们通常采用双向数据绑定方式向前端显示此信息的方式是什么？

我使用以下内容构建了我的网页：

AngularJS
CherryPy Server
MySQL数据库

我不使用的是：

PHP

目前，我第一次处理与从数据库中获取信息有关的任何事情，我目前不确定如何在前端显示此信息。

这是我的尝试：

app.controller('PlayerCtrl', ['$scope',
                       '$location',
                       '$log',
                       '$window',
                       '$rootScope',
                       'Person',
                       function ($scope,
    $location,
    $log,
    $window,
    $rootScope,
    Person) {

    $scope.options;
    $scope.Name;
    $scope.Email;
    $scope.Summary;
    $scope.Position;
    $scope.Gpa;
    $scope.Gender;
    $scope.priPosition;
    $scope.secPosition;
    $scope.ACT;
    $scope.SAT;
    $scope.TOEFL;
    $scope.Citizenship;
    $scope.FieldOfStudy;
    $scope.Sport;
    $scope.Country;
    $scope.Address;
    $scope.DateOfBirth;
    $scope.Level;

    // function for snagging specific DB entries
    $scope.getPage = function (searchOption) {
        Person.get(searchOption).$promise.then(function (data) {
            var pulledData = [];
            pulledData = data.results;
            $scope.$apply(function () {
                $scope.Email = pulledData["Email"];
                $scope.Name = pulledData["Name"];
                $scope.Summary = pulledData["Summary"];
                $scope.Position = pulledData["Position"];
                $scope.Gpa = pulledData["GPA"];
                $scope.Gender = pulledData["Gender"];
                $scope.priPosition = pulledData["priPosition"];
                $scope.secPosition = pulledData["secPosition"];
                $scope.ACT = pulledData["ACT"];
                $scope.SAT = pulledData["SAT"];
                $scope.TOEFL = pulledData["TOEFL"];
                $scope.Citizenship = pulledData["Citizenship"];
                $scope.FieldOfStudy = pulledData["FieldOfStudy"];
                $scope.Sport = pulledData["Sport"];
                $scope.Country = pulledData["CountryPlayingIn"];
                $scope.Address = pulledData["Address"];
                $scope.DateOfBirth = pulledData["DateOfBirth"];
                $scope.Level = pulledData["Level"];

            });
        });
    };


}]);

Answer 1

$ http promise的结果是一个表示HTTP响应的对象，其中包含以下字段：

状态
数据
标题
配置

没有理由使用$ scope。$ apply（），你不应该在范围内放置单个字段。只需把整个人对象：

    Person.get(searchOption).$promise.then(function (response) {
        $scope.person = response.data.results;
    });

然后在你看来：

{{ person.Name }} {{ person.Email }} (for example)

我强烈建议您花点时间学习如何使用浏览器调试器。您可以通过使用调试器检查响应的结构（或者甚至只是将其打印到控制台）轻松地找到它。

AngularJS：使用mySQL数据库的双向数据绑定

1 个答案: