2016-02-24 19 views
0

我Plunker:http://plnkr.co/edit/1lof9pSiTHmIMTq8qHuU?p=preview如何取消選擇Angular應用程序中的單選按鈕?

enter image description here

這裏是我的無線輸入列表:

<ul> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('client')" value="client">Client<div class="fr">10</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('competitor-name')" value="competitor-name">Competitor Name<div class="fr">25</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('company-name')" value="company-name">Company Name<div class="fr">16</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('government')" value="government">Government<div class="fr">111</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('events')" value="events">Events<div class="fr">97</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('industry')" value="industry">Industry<div class="fr">10</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('people')" value="people">People<div class="fr">18</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('philanthropic')" value="philanthropic">Philanthropic<div class="fr">5</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('products')" value="products">Products<div class="fr">4</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('product-category')" value="product-category">Product (Category)<div class="fr">26</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('product-feature')" value="product-feature">Product (Feature)<div class="fr">13</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('place')" value="place">Place<div class="fr">434</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('problem')" value="problem">Problem<div class="fr">53</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('news')" value="news">News<div class="fr">33</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('related-company-name')" value="related-company-name">Related Company Name <div class="fr">88</div></li> 
    <li name="cat-radio" ng-cloak><input type="radio" ng-model="check" ng-change="onSort('trend')" value="trend">Trend<div class="fr">2</div></li> 
</ul> 

我deselectAll NG-點擊功能:

$scope.deselectAll = function() { 
    vs.catBrand  = false, 
    vs.catClient  = false, 
    vs.catCompetitor = false, 
    vs.catCompName = false, 
    vs.catGov   = false, 
    vs.catEvents  = false, 
    vs.catIndustry = false, 
    vs.catPeople  = false, 
    vs.catPhil  = false, 
    vs.catProducts = false, 
    vs.catProductCat = false, 
    vs.catProductFeat = false, 
    vs.catPlace  = false, 
    vs.catProblem  = false, 
    vs.catNews  = false, 
    vs.catRelatedCo = false, 
    vs.catTrend  = false; 

    var ele = document.getElementsByName("cat-radio"); 

    for(var i=0;i<ele.length;i++) { 
     ele[i].checked = false; 
    } 
} 

回答

0

只需加$ scope.check =假你的方法取消選擇所有它將開始工作


$scope.deselectAll = function() { 
vs.catBrand  = false, 
vs.catClient  = false, 
vs.catCompetitor = false, 
vs.catCompName = false, 
vs.catGov   = false, 
vs.catEvents  = false, 
vs.catIndustry = false, 
vs.catPeople  = false, 
vs.catPhil  = false, 
vs.catProducts = false, 
vs.catProductCat = false, 
vs.catProductFeat = false, 
vs.catPlace  = false, 
vs.catProblem  = false, 
vs.catNews  = false, 
vs.catRelatedCo = false, 
vs.catTrend  = false; 
$scope.check=false; 

var ele = document.getElementsByName("cat-radio"); 

for(var i=0;i<ele.length;i++) { 
    ele[i].checked = false; 
}