使用REST API编辑Ng-Repeat内联

时间:2014-06-11 15:26:05

标签: angularjs rest slim ng-repeat

我已经有一段时间了,但简而言之,我正在制作一个UI,允许我们的用户使用Angular前端和Slim PHP修改MySQL数据库以提供REST。

我继续收到错误消息,指出' firstName'没有定义为列,我似乎无法弄清楚为什么。我认为它与ng-repeat的工作方式以及如何分配/调用其中的对象有关,但我被卡住了!

这是HTML,App.js和index.php - 代码有点乱,但我想在线编辑行。

我今年刚开始使用Angular和REST时,非常感谢任何知识!

List.html

<div class="row">
    <div class="col-lg-12">
        <table class="table table-hover">
            <thead>
                <tr>
                    <th>Id</th> 
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Address 1</th>      
                    <th>Address 2</th>      
                    <th>City</th>
                    <th>State</th> 
                    <th>Zip</th>
                    <th class="text-center">Edit</th>
                </tr>
            </thead>
            <tbody ng-repeat="referral in referrals | filter:query | limitTo:limitBy | orderBy:lastName">
                <tr >
                    <td>{{referral.ID}}</td>
                    <td>
<!--                        <span id="firstName" data-ng-hide="editMode">{{referral.firstName}}</span>-->
                        <span data-ng-hide="editMode">{{referral.firstName}}</span>
                        <input type="text" data-ng-show="editMode" ng-model="referral.firstName"/>
                    </td>
                    <td>
                        <span data-ng-hide="editMode">{{referral.lastName}}</span>
                        <input type="text" data-ng-show="editMode" ng-model="referral.lastName"/>
                    </td>
                    <td>
                        <span data-ng-hide="editMode">{{referral.address1}}</span>
                        <input type="text" data-ng-show="editMode" data-ng-model="referral.address1"/>
                    </td>
                    <td>
                        <span data-ng-hide="editMode">{{referral.address2}}</span>
                        <input type="text" data-ng-show="editMode" data-ng-model="referral.address2"/>
                    </td>
                    <td>
                        <span data-ng-hide="editMode">{{referral.city}}</span>
                        <input type="text" data-ng-show="editMode" data-ng-model="referral.city"/>
                    </td>
                    <td>
                        <span data-ng-hide="editMode">{{referral.state}}</span>
                        <input type="text" data-ng-show="editMode" data-ng-model="referral.state"/>
                    </td>
                    <td>
                        <span data-ng-hide="editMode">{{referral.zipCode}}</span>
                        <input type="text" data-ng-show="editMode" data-ng-model="referral.zipCode"/>
                    </td>
                    <td class="text-center">
                        <button type="submit" data-ng-hide="editMode" data-ng-click="editMode = true; editAppKey(entry)" class="btn btn-default">Edit</button>
                        <button type="submit" data-ng-show="editMode" data-ng-click="editMode = false; saveField(referral)" class="btn btn-default">Save</button>
                        <button type="submit" data-ng-show="editMode" data-ng-click="editMode = false; cancel()" class="btn btn-default">Cancel</button>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

App.js

app.controller('viewController', function($resource, $scope, $location, $route, $routeParams) {

    $scope.title = 'Endo Admin';

    $scope.query = {};
    $scope.queryBy = 'lastName';
    $scope.limitBy = '50';  

    var Referrals = $resource('http://pdgrosit02v/endoAdmin/app/api/referrals'); 

    $scope.referrals = Referrals.query();

    $scope.newField = {};
    $scope.editing = false;

    $scope.editAppKey = function(field) {
        $scope.editing = $scope.referrals.indexOf(field);
        $scope.newField = angular.copy(field);  
    }

    $scope.saveField = function(index) {
//        if ($scope.editing !== false) {

//        var Referral = $resource(('http://pdgrosit02v/endoAdmin/app/api/referral/'+ index.ID));
//
//        $scope.referral = Referral.get();
//        
          $scope.referral = $scope.newField;
//            $scope.editing = false;

            var ReferralPut = $resource(('http://pdgrosit02v/endoAdmin/app/api/referral/'+ index.ID), {}, { update: { method: 'PUT'}} );

            ReferralPut.update($scope.referral, function() {
                    // success
                    $location.path('/endoadmin');                     
                }, function() {
                    // error
                    console.log(error);
                });      
    };     
});   

的index.php

<?php

require 'Slim/Slim.php';
\Slim\Slim::registerAutoloader();

use Slim\Slim;

$app = new Slim();

$app->get('/referrals', 'getReferrals');

$app->get('/referral/:id',  'getReferral');

$app->put('/referral/:id', 'updateReferral');

$app->run();

function updateReferral($id) {
    $referral = Slim::getInstance()->request()->getBody();
    $data = json_decode($referral, true);
    $sql = "UPDATE endo_referral SET firstName=:first_Name, lastName=:last_Name WHERE ID=$id";
    try {
        $db = getConnection();
        $stmt = $db->prepare($sql);
        $stmt->bindValue(":first_Name", $data['firstName']);
        $stmt->bindValue(":last_Name", $data['lastName']);
        $stmt->execute();
        $db = null;
        echo json_encode($data); 
    } catch(PDOException $e) {
        echo '{"error":{"text":'. $e->getMessage() .'}}'; 
    }
}

1 个答案:

答案 0 :(得分:1)

在$ scope.saveField函数中,您应该使用传入的引用。而不是

...
ReferralPut.update($scope.referral, function() {
                    // success
                    $location.path('/endoadmin');                     
                }, function() {
                    // error
                    console.log(error);
                });
...  

查看您的代码,看起来需要:

ReferralPut.update(index, function() {
                    // success
                    $location.path('/endoadmin');                     
                }, function() {
                    // error
                    console.log(error);
                 });  

$ scope.saveField函数在index字段中传递当前引用。 $ scope.referral在saveField函数中未定义。

可能还有其他问题,但这是最突出的问题。