Angular js Radio Button

症状: 绑定一个list   radio button 老是只能绑定一行,纠结了很久 ,回家发现  原来是 name 用了同一个  ,坑啊,记录下 免得下次再犯。

之前的代码

     <ul>
            <li ng-repeat="row in list">
                <span> {{row.name}}</span>

                <label class="radio">
                    <input type="radio" name="abc" value="1" ng-model="row.type">ddddd</input>
                </label>

                <label class="radio"> <input type="radio" name="abc" value="2" ng-model="row.type">dfsfd</input></label>

                <label class="radio"> <input type="radio" name="abc" value="3" ng-model="row.type">sfd</input></label>

                Value:{{row.type}}
            </li>
        </ul>

 改后的代码

     <ul>
            <li ng-repeat="row in list">
                <span> {{row.name}}</span>

                <label class="radio">
                    <input type="radio" name="abc{{row.name}}" value="1" ng-model="row.type">ddddd</input>
                </label>

                <label class="radio"> <input type="radio" name="abc{{row.name}}" value="2" ng-model="row.type">dfsfd</input></label>

                <label class="radio"> <input type="radio" name="abc{{row.name}}" value="3" ng-model="row.type">sfd</input></label>

                Value:{{row.type}}
            </li>
        </ul>
时间: 2025-01-07 12:01:58

Angular js Radio Button的相关文章

activiti自定义流程之整合(二):使用angular js整合ueditor创建表单

注:整体环境搭建:activiti自定义流程之整合(一):整体环境配置 基础环境搭建完毕,接下来就该正式着手代码编写了,在说代码之前,我觉得有必要先说明一下activit自定义流程的操作. 抛开自定义的表单不谈,通过之前的了解,我们知道一个新的流程开始,是在启动流程实例(processIntence)的时候,而流程实例依赖于流程定义(processDefinition),流程定义又依赖于流程模型(model). 我们用到的自定义表单需要在创建模型,画模型图的时候就指定表单的名称formKey,需

activiti自己定义流程之整合(二):使用angular js整合ueditor创建表单

基础环境搭建完成,接下来就该正式着手代码编写了,在说代码之前.我认为有必要先说明一下activit自己定义流程的操作. 抛开自己定义的表单不谈.通过之前的了解,我们知道一个新的流程開始.是在启动流程实例(processIntence)的时候,而流程实例依赖于流程定义(processDefinition).流程定义又依赖于流程模型(model). 我们用到的自己定义表单须要在创建模型,画模型图的时候就指定表单的名称formKey.须要保证这个formKey和我们创建的表单名称一致. 表单并不在创建

Angular.js学习笔记 (二)

用A链接对象解析url的组成 var url = 'https://www.baidu.com:8080/aaa/1.html?id=10#name'; var aLink = document.createElement('a'); aLink.href = url; console.log(aLink);//<a href="https://www.baidu.com:8080/aaa/1.html?id=10#name"></a> console.log(

全栈老司机roadmap笔记--------(3)angular js

level 3 Forms and Models 如何添加和显示review? review内容作为product的内容的一部分!放在app.js文件里面 在html显示页面里面,增加一个循环来显示review的内容 我们如何把表单要填写的内容和我们要显示的内容进行绑定呢? 通过ng-model directive!!! 另外2个two-way binding example, radio button和check box 练习code 1 <!DOCTYPE html> 2 <html

angular js的一些操作

angular使开发应用变得简单,降低构建复杂应用难度!但是它依赖注入!anjular不操作dom节点而是一个作用域 要操作作用域 就要先绑定,如何绑定一个作用域呢? 首先在页面引入 <script src="anjular.js">文件! <html ng-app></html>意思就是把整个html页面当做作用域! 绑定作用域是“ng-app” 绑定好作用域就可以对作用域内的绑定表达式进行数据绑定 <body> hello{{“wor

使用angular.js获取form表单中的信息

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注册</title> <script src="./node_modules/angular/angular.js"></script> </head> <body ng-app="s1

通过Web Api 和 Angular.js 构建单页面的web 程序

在传统的web 应用程序中,浏览器端通过向服务器端发送请求,然后服务器端根据这个请求发送HTML到浏览器,这个响应将会影响整个的页面,比如说:用户通过一个连接导航到一个页面,会发送一个请求到服务器端,接下来服务器将会发送一个新的页面给浏览器. 但是在单页面应用程序中,整个页面只是在浏览器一开始请求的时候才会加载,接下来的请求,下来的交互请求都是通过ajax 来完成的,这就意味着只有部分的页面会更新,并不需要去加载整个的页面,这就减少了对用户操作的响应时间,从而使用户有一个更流畅的体验.但是在传统

angular js h5关于表单验证的例子

angular js表单验证 <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script src="angular.min.js"></script> <link rel="stylesheet" href="

angular js 实现表单提交时下面的table获取到表单里面的数据

angular js 实现表单提交时下面的table获取到表单里面的数据<!DOCTYPE html><html ><head lang="en"> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="css/bootstrap.min.css"/> <s