第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機(jī)立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何使行在單擊按鈕時改變顏色并在再次單擊時返回原始顏色

如何使行在單擊按鈕時改變顏色并在再次單擊時返回原始顏色

慕無忌1623718 2023-10-16 10:38:45
當(dāng)單擊按鈕時,我想更改顏色,當(dāng)單擊同一按鈕時,我想返回到原始顏色?,F(xiàn)在,當(dāng)單擊按鈕時,所有行都會改變顏色。html<table>      <tbody ng-repeat="field in availableFields">        <tr  ng-class="{'orderTypeTableRowSelected':tableRowTrueOrFalse}">                <td style="padding:3px;">{{field.name}}</td>                <td style="padding:3px;">                <button type="button" ng-click="orderTypeTableRowSelected(field)" class="btn btn-danger" style="margin-left:10px;"><i class="fas fa-check"></i>&nbsp;Required</button>        <button type="button" class="btn btn-warning"><i class="fas fa-check"></i>&nbsp;Default&nbsp;&nbsp;&nbsp;</button>                </td>    </tr>    </tbody></table>CSS<style>    .orderTypeTableRowSelected {        background-color: #E0F7FA;    }</style>有角的        $scope.tableRowTrueOrFalse = false;        $scope.orderTypeTableRowSelected = function (field) {            $scope.tableRowTrueOrFalse = !$scope.tableRowTrueOrFalse;            console.log(field);        };
查看完整描述

1 回答

?
慕神8447489

TA貢獻(xiàn)1780條經(jīng)驗(yàn) 獲得超1個贊

這里的問題是你有一個值列表,但只有一個布爾值代表所有這些值。


tableRowTrueOrFalse應(yīng)該是布爾值數(shù)組而不是布爾值。然后你應(yīng)該用默認(rèn)值填充數(shù)組false。


$scope.tableRowTrueOrFalse = Array(availableFields.length).fill(false);

在你的 html 中,它會是這樣的:


<table>

      <tbody ng-repeat="field in availableFields">

        <tr  ng-class="{'orderTypeTableRowSelected':tableRowTrueOrFalse[$index]}">

                <td style="padding:3px;">{{field.name}}</td>

                <td style="padding:3px;">

                <button type="button" ng-click="orderTypeTableRowSelected(field, $index)" class="btn btn-danger" style="margin-left:10px;"><i class="fas fa-check"></i>&nbsp;Required</button>

        <button type="button" class="btn btn-warning"><i class="fas fa-check"></i>&nbsp;Default&nbsp;&nbsp;&nbsp;</button>

                </td>


    </tr>

    </tbody>

</table>

然后在你的函數(shù)中,


$scope.orderTypeTableRowSelected = function (field, index) {

            $scope.tableRowTrueOrFalse[index] = !$scope.tableRowTrueOrFalse[index];

            console.log(field);

        };


查看完整回答
反對 回復(fù) 2023-10-16
  • 1 回答
  • 0 關(guān)注
  • 107 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號