Javascript 重置AngularJS中的textarea后Ng模型未更新

我为这个问题绞尽脑汁已有一段时间了。我制作了一个textarea并用ng模型创建了一个模型。这一切都很好。我还有一个按钮，它使用纯Javascript重置textarea。当我单击此按钮时，绑定停止工作，我仍然可以在另一个字段中看到我的文本，但文本区域是emtpy。我在这里重新创建了这个问题

我是否在这里遗漏了什么，或者这不是绑定在Angular中的工作方式。当我开始重新键入时，它会再次开始“侦听”，并显示正确的文本

是否有人有线索或以前遇到过这个问题

---

提前感谢。

不知道为什么不使用angular重置文本区域

您可以在控制器中没有函数的情况下使用

ng click=“txt=”

进行重置，但最好这样做

ng click=“reset（）”

有关演示，请参见下面和此处的

var-app=angular.module（'myApp'，[]）；
app.controller（'MainCtrl'，['$scope'，函数（$scope）{
$scope.txt=''；
$scope.reset=函数（）{
$scope.txt=''；
};
}]);

{{txt}
重置文本区域
不确定为什么不使用angular重置文本区域

您可以在控制器中没有函数的情况下使用
ng click=“txt=”
进行重置，但最好这样做
ng click=“reset（）”

有关演示，请参见下面和此处的


var-app=angular.module（'myApp'，[]）；
app.controller（'MainCtrl'，['$scope'，函数（$scope）{
$scope.txt=''；
$scope.reset=函数（）{
$scope.txt=''；
};
}]);

{{txt}
重置文本区域
这把小提琴可以满足你的要求，但它没有棱角


以下是一种更具角度的方法：



{{txt}
重置文本区域
这把小提琴可以满足你的要求，但它没有棱角


以下是一种更具角度的方法：



{{txt}
重置文本区域
Angular不喜欢ng模型的字符串变量，而且根据我的经验，它似乎不会更新它们。我将变量更改为具有字符串属性的对象，然后在控制器中初始化该对象


将成为

在控制器中，我初始化xyz

app.controller('MainCtrl', ['$scope', function ($scope) {
    $scope.xyz = { text: '' };
    
    initialize();

    function initialize() {
        $scope.xyz = { text: '' };
    };
}]);

Angular不喜欢ng模型中的字符串变量，根据我的经验，似乎也不会更新它们。我将变量更改为具有字符串属性的对象，然后在控制器中初始化该对象


将成为

在控制器中，我初始化xyz

app.controller('MainCtrl', ['$scope', function ($scope) {
    $scope.xyz = { text: '' };
    
    initialize();

    function initialize() {
        $scope.xyz = { text: '' };
    };
}]);

ngmodel与设置
文档无关。getElementById（'textarea'）。value=“”
只需绑定ng单击该按钮并重置ng模型绑定属性。如果要在angular之外更新，则必须执行$scope。$apply（）@PSL有一个绑定到按钮的ng click，该按钮调用一个函数来重置文本区域。在这种情况下不需要
$apply
。触发文本区域上的
input
事件就足够了，因为
ng model
会侦听该事件并在内部启动摘要循环：为什么要在此处应用。如果您有ng单击，则从那里清除模型。ngmodel与设置
文档无关。getElementById（'textarea'）。value=“”
只需绑定ng单击该按钮并重置ng模型绑定属性如果您在angular之外更新，则必须执行$scope。$apply（）@PSL有一个绑定到按钮的ng click，该按钮调用一个函数来重置文本区域。在这种情况下不需要
$apply
。触发文本区域上的
input
事件就足够了，因为
ng model
会侦听该事件并在内部启动摘要循环：为什么要在此处应用。如果您有ng单击，然后从那里清除模型。这是可行的，但我在控制台中得到一个错误，说$apply已经在进行中。为了清楚起见，行
document.getElementById（'textarea'）。value=“”。您正在执行冗余的
document.getElementById（'textarea'）。value=“”这也是一种糟糕的方法。摘要问题是因为OP已经关联了一个ng click，所以整个onclick调用也是多余的。我认为这可能会让人困惑。这两个代码段并不打算一起使用。所以就强迫我输入一些代码。第一个问题是如何使用javascript解决这个问题。第二个是在没有任何javascript的情况下使用的，使用纯angular。这是可行的，但我在控制台中得到一个错误，说$apply已经在进行中。只是要澄清一点，行
document.getElementById（'textarea'）。value=“”。您正在执行冗余的
document.getElementById（'textarea'）。value=“”这也是一种糟糕的方法。摘要问题是因为OP已经关联了一个ng click，所以整个onclick调用也是多余的。我认为这可能会让人困惑。这两个代码段并不打算一起使用。所以就强迫我输入一些代码。第一个问题是如何使用javascript解决这个问题。第二个是不使用任何javascript的，使用纯angular。在我重置之前，我做了很多事情，我在工厂里做。所以我想知道我是否可以达到我的$scope重置。我不是直接在控制器中生成函数。我将工厂作为依赖项注入控制器中，因此我的控制器可以访问工厂中的所有函数。为什么这么糟糕？@Mikey甚至连视图的重置功能都没有？控制器是为视图构建的。您通常不会在服务中放置视图绑定逻辑，控制器就是用于此目的的。我怀疑是因为你的评论

<div ng-app>
    <textarea id="textarea" ng-model="txt"></textarea>
    <div>{{txt}}</div>
    <button id='btn' ng-click='txt=""'>Reset textarea</button>
</div>

app.controller('MainCtrl', ['$scope', function ($scope) {
    $scope.xyz = { text: '' };
    
    initialize();

    function initialize() {
        $scope.xyz = { text: '' };
    };
}]);