javascript - 使用 AngularJS 使输入出现

Question

我是一个真正的 AngularJS 和 JS 菜鸟，他试图在用户双击某个元素时显示输入，但是我无法让它工作。目前我有这个错误...TypeError:无法设置未定义的属性“编辑”

这是我的代码...

var reportsControllers = angular.module('vdApp', [], function($interpolateProvider) {
    $interpolateProvider.startSymbol('[[');
    $interpolateProvider.endSymbol(']]');
});

reportsControllers.controller('ApplicantCtrl', ['$scope', '$http', function($scope, $http) {
    $http.get('http://myurl.com').success(function(data) 
    {
        $scope.applicants = data;
    });

    angular.forEach($scope.applicants, function() {
        editing: false;
    });

    $scope.orderProp = 'dob';

    $scope.editApplicant = function(applicant) {
        applicant.editing = true;
    };

    $scope.doneEditing = function(applicant) {
        applicant.editing = true;
    };

}]);

和我的 HTML/blade 模板...

<div ng-app="vdApp" ng-controller="ApplicantCtrl">
    <div class="input-group spacer-bottom-2x">
        <span class="input-group-btn"><button class="btn btn-default btn-lg" type="button">Filter:</button></span>
        <input class="form-control input-lg" ng-model="query" />
    </div>          

    <div class="table-responsive">
        <table class="table table-striped table-bordered">
            <thead>
                <tr>
                    <th width="15%"><a href="" ng-click="orderProp='fname'">Name</a></th>
                    <th width="10%"><a href="" ng-click="orderProp='surname'">DOB</a></th>
                    <th width="5%">CV</th>
                    <th width="25%"><a href="" ng-click="orderProp=''">Tel</a></th>
                    <th width="25%"><a href="" ng-click="orderProp=''">Email</a></th>
                    <th width="10%"><a href="" ng-click="orderProp='postTown'">Post Town</a></th>
                    <th width="20%"><a href="" ng-click="orderProp='page_title'">Interest</a></th>
                    <th width="10%"><a href="" ng-click="orderProp='created_at'">Applied</a></th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="app in applicants| filter: query | orderBy: orderProp">
                    <td>[[ app.fname ]] [[ app.surname ]]</td>
                    <td>[[ app.dob ]]</td>
                    <td><div ng-if="app.cv != ''"><a href="[[ app.cv ]]" target="_blank">View</a></div></td>
                    <td >
                        <span ng-hide="applicant.editing" ng-dblclick="editApplicant(applicant)">[[ app.tel ]]</span>
                        <div class="form-group" ng-show="applicant.editing" ng-model="app.id" ng-blur="doneEditing(applicant)" autofocus>
                            <input class="form-control input-lg" ng-model="query" />
                        </div>
                    </td>
                    <td>[[ app.email ]]</td>
                    <td>[[ app.postTown ]]</td>
                    <td>[[ app.page_title ]]</td>
                    <td>[[ app.created_at ]]</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

谁能帮助我并告诉我我做错了什么？

谢谢!

Answer 1

您将中继器声明为 ng-repeat="app in申请人" 但然后尝试 ng-dblclick="editApplicant(applicant) 和 ng-show ="applicant.editing".

applicant 不存在 - 您应该使用转发器循环变量 app 来代替。