angular.js - angular js點擊按鈕隱藏選中元素
問題描述
如何點擊按鈕就刪除選中元素?<p ng-app='myApp' ng-controller='myCon'>
<p class='headerW'><p class='header'> 購物車(2) <span ng-click='remove($index)'></span> <br clear='all'/></p> </p> <p class='mainbody'><ul> <li ng- ng-hide='x.li_hide' ng-repeat='x in products_mes'><p class='li_center'> <p ng-click='toggleC($index)'></p> <p class='goods_part'><p class='rightbox'> <p class='goods_content'>{{x.content}}</p> <p class='price_area'><span class='new_money'>{{x.newMoney}}</span><span class='old_money'>{{x.oldMoney}}</span><span class='conter'> <span class='remove_btn'>-</span><input type='number' class='' value='1'/><span class='add_btn'>+</span> <br clear='all'/></span> </p></p> </p> <br clear='all'/></p> </li><li ng-hide='sw'><p class='li_center'> <p class='select_btn'></p> <p class='lose'>失效</p> <p class='goods_part'><p class='rightbox'> <p class='goods_content'>嬌韻詩清透潤白柔膚水清爽型200ml</p> <p class='price_area'><span class='new_money'>¥390.00</span><span class='old_money'>¥420.00</span><span class='conter'> <span class='remove_btn'>-</span><input type='number' class='' value='1'/><span class='add_btn'>+</span> <br clear='all'/></span> </p></p> </p> <br clear='all'/></p></li><script>var app=angular.module('myApp',[]);app.controller('myCon',function($scope){ $scope.sw=false;$scope.disappear=function(){ $scope.sw=true;};$scope.products_mes=[{onSw:false,content:'嬌韻詩清透潤白柔膚水清爽型200ml',newMoney:'¥390.00',oldMoney:'¥420.00',products_img:'img/product.png' },{onSw:false,content:'嬌韻詩清透潤白柔膚水清爽型100ml',newMoney:'¥390.00',oldMoney:'¥420.00',products_img:'img/product.png' }];$scope.products_mes.onSw=false;$scope.toggleC=function($index){$scope.products_mes[$index].onSw=!$scope.products_mes[$index].onSw;var index = $scope.products_mes.indexOf($index);if($scope.products_mes[$index].onSw){} }; $scope.delProds =[]; });
</script> 點擊.trash_can按鈕隱藏選中的li標簽angular.js - angular js點擊按鈕隱藏選中元素
問題解答
回答1:
建一個空數(shù)組 用來存放你需要刪除數(shù)據(jù)的index 例如delProds
在你的checkbox上加上ng-click觸發(fā)時判斷為true的時候就把這個產(chǎn)品的index push到delProds數(shù)組為false的時候從delProds里面刪除
然后在點擊刪除按鈕的時候把對應序號的數(shù)據(jù)都刪除掉就可以了
回答2:
用splice(),比如products_mes.splice(下標,1) 可以刪除數(shù)組的某一項
回答3:
$scope.remove = function(idx) { $scope.products_mes.splice(idx, 1);}回答4:
var index = products_mes.indexOf(data);products_mes.splice(index,1);data:為選中的那個對象
回答5:
splice
相關(guān)文章:
1. javascript - 使用form進行頁面跳轉(zhuǎn),但是很慢,如何加一個Loading?2. python 計算兩個時間相差的分鐘數(shù),超過一天時計算不對3. docker-compose中volumes的問題4. javascript - 后臺管理系統(tǒng)左側(cè)折疊導航欄數(shù)據(jù)較多,怎么樣直接通過搜索去定位到具體某一個菜單項位置,并展開當前菜單5. docker-machine添加一個已有的docker主機問題6. angular.js - 輸入郵箱地址之后, 如何使其自動在末尾添加分號?7. javascript - ES6規(guī)范下 repeat 函數(shù)報錯 Invalid count value8. javascript - html5的data屬性怎么指定一個function函數(shù)呢?9. html5 - 為什么使使用vue cli 腳手架,post-css 沒有自動對css3屬性自動添加瀏覽器前綴呢?10. javascript - 如何使用nodejs 將.html 文件轉(zhuǎn)化成canvas
