Javascript 如何使用angular js动态更改按钮的名称

我的代码：

<button id="btnajs" ng-click="AppendText()">Using angularjs</button>
<div id="divID"></div>
<script>
var count=1;
function myCtrl($scope) {
    $scope.AppendText = function() {
     var myEl = angular.element( document.querySelector( '#divID' ) );
     myEl.append("<tr><td><button type='submit' name='id_"+count+"' class='newbtn' id='"+count+"' data-toggle='modal' data-target='#mymodal'>{{bn}}</button></td></tr>");  
     count++;   
    }

}

var myapp=angular.module("myapp",[]);

myapp.controller('btncontrol',function($scope){
   $scope.bn="Save data";

   $scope.save=function(){
    $scope.bn= "Saving data...";


};
});

</script>

使用angularjs
var计数=1；
函数myCtrl（$scope）{
$scope.AppendText=函数（）{
var myEl=angular.element（document.querySelector（'#divID'）；
myEl.append（“{bn}”）；
计数++；
}
}
var myapp=angular.module（“myapp”，[]）；
myapp.controller（'btncontrol'，函数（$scope）{
$scope.bn=“保存数据”；
$scope.save=function（）{
$scope.bn=“保存数据…”；
};
});

单击按钮“angular js”，然后在其下方添加更多按钮。。我希望能够更改这些附加按钮的名称 要“保存数据”，单击同一按钮后更改为“保存数据…”，但它仅显示为{{bn}。

---

我已经添加了所有必要的库

您不必使用jquery方式

只需在使用函数单击按钮时更改范围变量

 $scope.AppendText = function(){
     $scope.bn = "saving data";
 }

演示

var-app=angular.module（'todoApp'，[]）；
app.controller（“dobController”、[“$scope”，
职能（$范围）{
$scope.bn=“保存数据”；
$scope.AppendText=函数（）{
$scope.bn=“保存数据”；
}
}
]);

待办事项清单
{{bn}}
像这样的怎么样


var-app=angular.module（'my-app'，[]，function（）{}）；
app.controller（'AppController'，函数（$scope）{
$scope.toggle=true；
})

保存数据
保存数据
无需在此代码中使用$scope.save。另外，单独编写html部分。如果你想和你的代码完全一样。请在myEl.append中调用save（）。
对不起。我想我没有正确解释我的问题。我做了一些编辑。。解释我想要什么。。