Angularjs - 使用单选按钮如何改变背景颜色 [英] Angularjs - How to change background color using radio button

问题描述

在我的网页，我动态创建的单选按钮。我想选择单选按钮时，改变包装的背景颜色。

以下是我的code

 ＆lt;节NG重复=列表myList中＆GT;
  ＆LT; D​​IV CLASS =radioWrapper＆GT;
    ＆LT;输入类型=电台NAME ={{list.category}}NG模型=list.name＆GT;
    ＆LT;标签＆gt; {{list.name}}＆LT; /标签＆gt;
   ＆LT; / DIV＆GT;
＆LT; /节＆gt;
 

我想在radioWrapper选择每个无线电时添加selectedRadioBg级。

鸭preciate任何帮助

解决方案

 ＆lt;节NG重复=列表myList中＆GT;
    ＆LT; D​​IV CLASS =radioWrapperNG-CLASS ={'selectedRadioBg'：list.name}＆GT;
        ＆LT;输入类型=电台NAME ={{list.category}}NG模型=list.name＆GT;
        ＆LT;标签＆gt; {{list.name}}＆LT; /标签＆gt;
    ＆LT; / DIV＆GT;
＆LT; /节＆gt;
 

替换为

 ＆lt;节NG重复=列表myList中＆GT;
    ＆LT; D​​IV CLASS =radioWrapper的风格=背景：{{list.name}}无重复滚动0％0％;＆GT;
        ＆LT;输入类型=电台NAME ={{list.category}}NG模型=list.model＆GT;
        ＆LT;标签＆gt; {{list.name}}＆LT; /标签＆gt;
    ＆LT; / DIV＆GT;
＆LT; /节＆gt;
 

**不要把你的list.name在NG-模型指令。

On my page, I have dynamically created radio buttons. I want to change wrapper background color when radio button is selected.

following is my code

<section ng-repeat="list in myList">
  <div class="radioWrapper">
    <input type="radio" name="{{list.category}}" ng-model="list.name">
    <label>{{list.name}} </label>
   </div>
</section>

I want to add "selectedRadioBg" class at the radioWrapper when each radio is selected.

Appreciate any help

解决方案

<section ng-repeat="list in myList">
    <div class="radioWrapper" ng-class="{'selectedRadioBg': list.name}>
        <input type="radio" name="{{list.category}}" ng-model="list.name">
        <label>{{list.name}} </label>
    </div>
</section>

Replace with

<section ng-repeat="list in myList">
    <div class="radioWrapper" style="background: {{list.name}} none repeat scroll 0% 0%;">
        <input type="radio" name="{{list.category}}" ng-model="list.model">
        <label>{{list.name}} </label>
    </div>
</section>

**Do not put your list.name in ng-model directive.

这篇关于Angularjs - 使用单选按钮如何改变背景颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！