Javascript AngularJS:函数未定义错误

我有以下代码，其中我必须在单击按钮时调用

removietem（）

函数，但发生了

removietem（）

函数未定义错误

JavaScript代码

$scope.AddShoppingItems = function() {
     console.log('clicked add item');

   i++;
         var div= document.createElement('div');
            div.innerHTML = 'Item : <input type="text" name="ShopItem_'+i+'"><input type="button" value="-" onclick="RemoveItem(this)">';
    document.getElementById('AddItemTextbox').appendChild(div);


    }
 $scope.RemoveItem = function(div){
 console.log('-ve clicked');
 document.getElementById('AddItemTextbox').removeChild(div.parentNode);
 i--;
 }

$scope.AddShoppingItems=函数（）{
log（'clicked add item'）；
i++；
var div=document.createElement（'div'）；
div.innerHTML='Item:'；
document.getElementById（'AddItemTextbox'）.appendChild（div）；
}
$scope.removietem=函数（div）{
log（'-ve clicked'）；
document.getElementById（'AddItemTextbox'）.removeChild（div.parentNode）；
我--；
}

只需更换这一行即可

div.innerHTML = 'Item : <input type="text" name="ShopItem_'+i+'"> <input type="button" value="-" onclick="RemoveItem(this)">';
';
document.getElementById('AddItemTextbox').appendChild(div);

div.innerHTML='Item:'；
';
document.getElementById（'AddItemTextbox'）.appendChild（div）；

借

div.innerHTML='项：
document.getElementById（'AddItemTextbox'）.appendChild（$compile（div）（$scope））；

您不能简单地将html元素附加到dom中。您需要将html元素编译到您的作用域中，然后只有作用域中的事件才会触发

试试这个

$scope.AddShoppingItems = function () {
    console.log('clicked add item');

    i++;
    var div = document.createElement('div');
    div.innerHTML = 'Item : <input type="text" name="ShopItem_' + i + '"><input type="button" value="-" ng-click="RemoveItem(this)">';
    var temp = $compile(div)($scope);
    angular.element(document.getElementById('AddItemTextbox')).append(temp);

}
$scope.RemoveItem = function (div) {
    console.log('-ve clicked');
    document.getElementById('AddItemTextbox').removeChild(div.parentNode);
    i--;
}

$scope.AddShoppingItems=函数（）{
log（'clicked add item'）；
i++；
var div=document.createElement（'div'）；
div.innerHTML='Item:'；
var temp=$compile（div）（$scope）；
元素（document.getElementById（'AddItemTextbox'））.append（temp）；
}
$scope.removietem=函数（div）{
log（'-ve clicked'）；
document.getElementById（'AddItemTextbox'）.removeChild（div.parentNode）；
我--；
}

---

寻找更多细节。不能像以前那样简单地绑定

onclick

事件。使用

ng单击

代替

您不应该在Angular中操作原始DOM，您应该在模板中使用Angular指令根据需要显示或隐藏按钮。那么确切的错误是什么@最直接的问题是，您试图从普通JavaScript调用角度作用域方法。更大的问题是你使用这个按钮的方法完全没有角度。实际上，我想通过点击“AddItemButton”来动态添加文本框和按钮。如果你花2小时阅读文档和教程，这是一个很小的问题。无论如何，德塞兹已经回答了你的问题。它也帮不了你。稍微接近正确的解决方案，但仍然不起作用，因为

ng click

没有任何意义，除非编译。

$scope.AddShoppingItems = function () {
    console.log('clicked add item');

    i++;
    var div = document.createElement('div');
    div.innerHTML = 'Item : <input type="text" name="ShopItem_' + i + '"><input type="button" value="-" ng-click="RemoveItem(this)">';
    var temp = $compile(div)($scope);
    angular.element(document.getElementById('AddItemTextbox')).append(temp);

}
$scope.RemoveItem = function (div) {
    console.log('-ve clicked');
    document.getElementById('AddItemTextbox').removeChild(div.parentNode);
    i--;
}