Question

我想隐藏并显示开始/停止按钮（切换），并在ng-repeat中第一次加载按钮状态。

HTML：

<div class="panel panel-warning" ng-repeat="msg in message">
        <button type="button" ng-show="{{msg.Status}} == 1" ng-click="StopSend(msg.msgkey)" class="start-sending btn btn-info btn-fill btn-sm" data-toggle="tooltip" data-original-title="Resume sending the message">
            <span><i class="fa fa-pause"></i></span>
            Stop sending
        </button>
        <button type="button" ng-show="{{msg.Status}} == 0" ng-click="StartSend(msg.msgkey)" class="start-sending btn btn-info btn-fill btn-sm" data-toggle="tooltip" data-original-title="Resume sending the message">
            <span><i class="fa fa-play"></i></span>
            Start sending
        </button>
  <div />

JS：

$scope.StartSend = function (mkey) {
    //Start Sending
    DataTransaction.StopSend(mkey,1).then(function successCallback(response) {
        console.log(response.data);//gets update value to db
    })
    .catch(function errorCallback(err) {
        console.log(err);
    });
}

$scope.StopSend = function (mkey) {

    //Stop Sending
    DataTransaction.StopSend(mkey,0).then(function successCallback(response) {
        console.log(response.data);/gets update value to db
    })
    .catch(function errorCallback(err) {
        console.log(err);
    });

}

$scope.Getmessages = function() {
    DataTransaction.GetMessage(Instaid).then(function successCallback(response) {

        $scope.message = response.data;

    })
    .catch(function errorCallback(err) {
        console.log(err);
    });
}

Answer 1

<div class="panel panel-warning" ng-repeat="msg in message">
        <button type="button" ng-click="Send(msg.msgkey, msg)" class="start-sending btn btn-info btn-fill btn-sm" data-toggle="tooltip" data-original-title="Resume sending the message">
            <span><i class="fa" ng-class="{'fa-play': msg.Status == 0, 'fa-pause': msg.Status == 1}"></i></span>
            <span ng-bind-template="{{msg.Status == 1 ? 'Stop Sending' : 'Start Sending'}}">
        </button>
  <div />

$scope.StartSend = function (mkey, msg) {
    //Start Sending
    msg.Status = msg.Status == 1 ? 0 : 1
    DataTransaction.StopSend(mkey,msg.Status).then(function successCallback(response) {
        console.log(response.data);//gets update value to db
    })
    .catch(function errorCallback(err) {
        console.log(err);
    });
}

查看未更新为范围值更新

1 个答案: