我在html中有一个表,其中多行有一些数据格式
scope
在角度js控制器中我想编写一个函数,当我点击重试按钮它会调用一些API调用,我已经写了一个,但是当我点击重试按钮时我需要它的按钮文本将改为重试... 如何唯一地识别角度js控制器中的每个按钮
答案 0 :(得分:3)
您可以使用ng-class以简单的方式完成此操作。 这是你的index.html
<!DOCTYPE html>
<html lang="en-US" ng-app="myApp">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="script.js"></script>
<style>
.red{
color:red;
}
</style>
<body>
<div ng-controller="myCtrl">
<button ng-click="abc=1" ng-class="{red:abc>0}">Click me</button>
</div>
</body>
</html>
这将是script.js
angular.module('myApp',[])
.controller('myCtrl',function($scope){
})
这不需要在控制器中编写特殊功能来改变颜色。 ng-class提供内置功能。</ p>
我也创造了一个插件 https://plnkr.co/edit/Koh1m6?p=preview
答案 1 :(得分:2)
您可以使用General
来显示数据,点击按钮时可以更改该按钮的名称。
假设这是你的数组
ng-repeat
你可以使用像这样的ng-repeat显示Dom中的数据
$scope.arr = [{"jobname":"sendemail","jobid":123, "Action":"btn1"},{"jobname":"sendReport","jobid":123, "Action":"btn2"},{"jobname":"sendWhatever","jobid":123, "Action":"btn3"}]
在单击中,函数将对象作为参数传递并更改按钮值
<tr ng-repeat="item in arr">
<td>{{item.jobname}}</td>
<td>{{item.jobid}}</td>
<td><button ng-click="clickFunc(item)">{{item.Action}}</button></td>
</tr>
演示
$scope.clickFunc = function(item){
item.Action = "retry"
}
&#13;
angular.module("app",[])
.controller("ctrl",function($scope){
$scope.arr = [{"jobname":"sendemail","jobid":123},{"jobname":"sendReport","jobid":123},{"jobname":"sendWhatever","jobid":123}]
$scope.clickFunc = function(item){
item.Action = "retry"
}
})
&#13;
答案 2 :(得分:0)
您可以使用如下(服务电话中的基本示例。):
$scope.buttonLabel = "Retry";
$scope.getServiceDealData = function () {
$scope.buttonLabel = "Retrying..";
yourDataService.getYourServiceData().then(function (data) {
$scope.dealData = data.deals;
$scope.buttonLabel = "Retry";
}).catch(function (data) {
$scope.errorMessage = "Oops! Something went wrong.";
$scope.buttonLabel = "Retry";
});
}
&#13;