AngularJS:从Javascript生成html时出现函数未定义错误

我可以从javaScript动态生成编辑表。但通过它提到的函数不能从AngularJS中重新指定，因此，我无法删除和编辑我的行

在这里，HvacStandards（）和checkemail（）以及showInvite（）只起作用。对于other，我在chorom控制台中遇到以下异常：

错误：

Uncaught ReferenceError: editRow is not defined 
Uncaught ReferenceError: deleteRow is not defined

AngularJs代码

$scope.HvacStandards = function () {
        var rowID = $scope.newRow;
        if ($scope.currentRow > 0) {
            saveEdits();
        } else {
            var teamName = $("#teamName").val();
            var email = $("#email").val();
            var sHtml = "<tr id='row"+rowID+"'>"
                    + "<td id=\"tno" + rowID + "\">" + rowID
                    + "</td>"
                    + "<td id=\"tName" + rowID + "\">" + teamName
                    + "</td>" + "<td id=\"mail" + rowID + "\">" + email
                    + "</td>" + "<td><button onclick='editRow(" + rowID
                    + ")'>Edit</button>&nbsp;" + "<button onclick='deleteRow("
                    + rowID + ")'>Delete</button>" + "</tr>";
            $("#inviteTable").append(sHtml);
            $scope.newRow++;
            $("#teamName,#email").val("");
            $scope.emails[$scope.number]=$scope.formData.email;

        }

    };

    $scope.editRow = function(rowID) {
        $('#teamName').val($('#tName' + rowID).html());
        $('#email').val($('#mail' + rowID).html());
        $scope.currentRow = rowID;
    };

    $scope.saveEdits = function (){
        $('#teamName' + currentRow).html($('#tName').val());
        $('#email' + currentRow).html($('#mail').val());
        $("#teamName,#email").val("");
        $scope.currentRow = -1;
    };

    $scope.deleteRow = function (rowID) {
        $('#row' + rowID).remove();
    };

    $scope.showInvite = function(){
        $scope.show = true;
        $scope.formData = {};
    };

$scope.HvacStandards=函数（）{
var rowID=$scope.newRow；
如果（$scope.currentRow>0）{
saveEdits（）；
}否则{
var teamName=$（“#teamName”）.val（）；
var email=$（“#email”）.val（）；
var sHtml=“”
+“”+rowID
+ ""
+“”+团队名称
+“+”+电子邮件
+“+”编辑“+”删除“+”；
$（“#可邀请”）.append（sHtml）；
$scope.newRow++；
$（“#团队名称，#电子邮件”）.val（“”）；
$scope.email[$scope.number]=$scope.formData.email；
}
};
$scope.editRow=函数（rowID）{
$（'#teamName'）.val（$（'#tName'+rowID.html（））；
$（'#email'）.val（$（'#mail'+rowID.html（））；
$scope.currentRow=rowID；
};
$scope.saveEdits=函数（）{
$（'#teamName'+currentRow）.html（$（'#tName'）.val（））；
$（'#email'+currentRow）.html（$（'#mail'）.val（））；
$（“#团队名称，#电子邮件”）.val（“”）；
$scope.currentRow=-1；
};
$scope.deleteRow=函数（rowID）{
$（'#行'+rowID）.remove（）；
};
$scope.showInvite=函数（）{
$scope.show=true；
$scope.formData={}；
};

我的html如下所示：

    <div name="showInviteDiv" id="showInviteDiv">
        <a ng-click="showInvite()" ng-show="!show">Invite a Team</a>
    </div>
    <div class="invite-form" name="inviteTeamDiv" id="inviteTeamDiv"  ng-show="show">
        <form ng-submit="HvacStandards()" novalidate class="css-form"
            name='inviteTeamsForm'>
            <div>
                <input type="text" name="teamName" ng-model="formData.teamName" id="teamName"
                    placeholder="Team Name" style="width: 38%;" required="required" 
                    ng-minlength="6" ng-maxlength="30"> 
                    <input
                    type="text" name="email" ng-model="formData.email" id="email"
                    placeholder="Email" style="width: 38%;" required="required" 
                    ng-pattern="/^[a-z]+[a-z0-9._]+@[a-z]+\.[a-z.]{2,5}$/" ng-change="checkEmail(form Data.email)" ng-blur="checkEmail(formData.email)">
            </div>
            <div>
                <input type="submit" value="Invite Team" 
                    ng-disabled="inviteTeamsForm.$invalid || isEmailExists"> or <a ng-click="hideInvite()">I'm done sending invites</a>
            </div>

邀请一个团队
否则我就不发送邀请了

在您正在创建的表中，您使用了onclick而不是ng click。您需要使用ng click才能使用scope函数

因此，您的HvacStandards函数将如下所示：

$scope.HvacStandards = function () {
    var rowID = $scope.newRow;
    if ($scope.currentRow > 0) {
        saveEdits();
    } else {
        var teamName = $("#teamName").val();
        var email = $("#email").val();
        var sHtml = "<tr id='row"+rowID+"'>"
                + "<td id=\"tno" + rowID + "\">" + rowID
                + "</td>"
                + "<td id=\"tName" + rowID + "\">" + teamName
                + "</td>" + "<td id=\"mail" + rowID + "\">" + email
                + "</td>" + "<td><button ng-click='editRow(" + rowID
                + ")'>Edit</button>&nbsp;" + "<button ng-click='deleteRow("
                + rowID + ")'>Delete</button>" + "</tr>";
        $("#inviteTable").append(sHtml);
        $scope.newRow++;
        $("#teamName,#email").val("");
        $scope.emails[$scope.number]=$scope.formData.email;

    }

};

$scope.HvacStandards=函数（）{
var rowID=$scope.newRow；
如果（$scope.currentRow>0）{
saveEdits（）；
}否则{
var teamName=$（“#teamName”）.val（）；
var email=$（“#email”）.val（）；
var sHtml=“”
+“”+rowID
+ ""
+“”+团队名称
+“+”+电子邮件
+“+”编辑“+”删除“+”；
$（“#可邀请”）.append（sHtml）；
$scope.newRow++；
$（“#团队名称，#电子邮件”）.val（“”）；
$scope.email[$scope.number]=$scope.formData.email；
}
};

$scope.HvacStandards=函数（）{
var rowID=$scope.newRow；
如果（$scope.currentRow>0）{
saveEdits（）；
}否则{
var teamName=$（“#teamName”）.val（）；
var email=$（“#email”）.val（）；
var sHtml=“”
+“”+rowID
+ ""
+“”+团队名称
+“+”+电子邮件
+“+”编辑“+”删除“+”；
//$（“#inviteTable”）.append（sHtml）；//不要这样做
//使用以下方式编译
$（“#可邀请”）.append(
$compile（sHtml）（$scope）
);
$scope.newRow++；
$（“#团队名称，#电子邮件”）.val（“”）；
$scope.email[$scope.number]=$scope.formData.email；
}
};

试试这个

$scope.HvacStandards = function () {
    var rowID = $scope.newRow;
    if ($scope.currentRow > 0) {
        saveEdits();
    } else {
        var teamName = $("#teamName").val();
        var email = $("#email").val();
        var sHtml = "<tr id='row"+rowID+"'>"
                + "<td id=\"tno" + rowID + "\">" + rowID
                + "</td>"
                + "<td id=\"tName" + rowID + "\">" + teamName
                + "</td>" + "<td id=\"mail" + rowID + "\">" + email
                + "</td>" + "<td><button ng-click='editRow(" + rowID
                + ")'>Edit</button>&nbsp;" + "<button ng-click='deleteRow("
                + rowID + ")'>Delete</button>" + "</tr>";

    // $compile(sHtml)($scope) aissign to variable:
    let shown = $compile(sHtml)($scope);
        $("#inviteTable").append(
                     shown;
            );
        $scope.newRow++;
        $("#teamName,#email").val("");
        $scope.emails[$scope.number]=$scope.formData.email;

    }

};

$scope.HvacStandards=函数（）{
var rowID=$scope.newRow；
如果（$scope.currentRow>0）{
saveEdits（）；
}否则{
var teamName=$（“#teamName”）.val（）；
var email=$（“#email”）.val（）；
var sHtml=“”
+“”+rowID
+ ""
+“”+团队名称
+“+”+电子邮件
+“+”编辑“+”删除“+”；
//$compile（sHtml）（$scope）aissign to变量：
让显示=$compile（sHtml）（$scope）；
$（“#可邀请”）.append(
展示；
);
$scope.newRow++；
$（“#团队名称，#电子邮件”）.val（“”）；
$scope.email[$scope.number]=$scope.formData.email；
}
};

我已经尝试过了，错误被删除了，但函数没有被调用。我正在控制台上打印以验证这一点。但是没有打电话。@vicky:你能为problemplunkr.co在那里创建一个plunkr吗？你可以重新创建这个问题，这样你的社区就可以看到你应该阅读的问题。我将详细介绍这种方法为什么有效，以及它对其他方法有什么好处。

$scope.HvacStandards = function () {
    var rowID = $scope.newRow;
    if ($scope.currentRow > 0) {
        saveEdits();
    } else {
        var teamName = $("#teamName").val();
        var email = $("#email").val();
        var sHtml = "<tr id='row"+rowID+"'>"
                + "<td id=\"tno" + rowID + "\">" + rowID
                + "</td>"
                + "<td id=\"tName" + rowID + "\">" + teamName
                + "</td>" + "<td id=\"mail" + rowID + "\">" + email
                + "</td>" + "<td><button ng-click='editRow(" + rowID
                + ")'>Edit</button>&nbsp;" + "<button ng-click='deleteRow("
                + rowID + ")'>Delete</button>" + "</tr>";

    // $compile(sHtml)($scope) aissign to variable:
    let shown = $compile(sHtml)($scope);
        $("#inviteTable").append(
                     shown;
            );
        $scope.newRow++;
        $("#teamName,#email").val("");
        $scope.emails[$scope.number]=$scope.formData.email;

    }

};