angular的点击添加
首先是在js里面我们可以用clone来点击添加一些东西比如列表或者其他的div之类的,但是在angular里面怎么实现点击添加呢?
类似这种:
这样就尴尬了,最少我这样的菜鸟是不知道怎么去写的,网上好像也没有!
后来一个老司机,哦不,大牛告诉我用ng-repeat可以实现
大概的代码是酱紫的:
h5:
<!--其他发明人-->
<div>
<!--添加发明人-->
<div class="ova mb30 ml15p">
<span class="color_standard curp" ng-click="replyObj.add_inventor()">
添加发明人 >
</span>
</div>
<div class="por" ng-repeat="inventor in replyObj.applicant.inventor.other">
<!--<div class="applicantDivider"></div>-->
<!--公布姓名-->
<div class="info_item">
<div class="infoItem_name"><span class="infoItem_needed">*</span>公布姓名:</div>
<div class="infoItem_content">
<div class="dib mr30">
<input ng-model="inventor.publish" id="otherInventor3_{{$index}}_type1" type="radio" ng-value="1">
<label for="otherInventor3_{{$index}}_type1">是</label>
</div>
<div class="dib">
<input ng-model="inventor.publish" id="otherInventor3_{{$index}}_type2" type="radio" ng-value="0">
<label for="otherInventor3_{{$index}}_type2">否</label>
</div>
</div>
</div>
<!--发明人姓名-->
<div class="info_item">
<div class="infoItem_name"><span class="infoItem_needed">*</span>发明人姓名:</div>
<div class="infoItem_content">
<input class="infoItem_contentMain" name="otherInventorName_{{$index}}" ng-model="inventor.name" type="text" placeholder="请填写设计人姓名" required>
<div class="infoItem_contentValid" ng-show="applicant_form.$submitted">
<div ng-show="applicant_form['otherInventorName_' + $index].$error.required">
<img ng-src="{{apply.img_src.invalid}}" alt="invalid">
</div>
<div ng-show="applicant_form['otherInventorName_' + $index].$valid">
<img ng-src="{{apply.img_src.valid}}" alt="valid">
</div>
</div>
</div>
</div>
<!--添加发明人-->
<div class="ova mb30 ml15p">
<span class="color_red mr10 curp" ng-click="delete_inventor(inventor)">删除</span>
<span ng-if="$last" class="color_standard curp" ng-click="apply.add_inventor()">添加发明人 ></span>
</div>
</div>
</div>
js:
大概就是这样,然鹅,它会报错,vm.applicant.inventor.push是undefind(最开始的h5代码里面我没有添加other,至于为什么就不告诉你们了)!
vm.applicant={};
vm.applicant.inventor={
other:[]
};
就这么简单!兴奋至于特此记录本次的脑残事件!
angular的点击添加的更多相关文章
- angular ng-repeat点击切换样式,浅谈track by $index
前言 angular ng-repeat点击切换样式,ng-repeat点击切换class样式,巧用ng-repeat track by $index. 1.问题 一个ul包含多个li,li通过ng- ...
- 今天遇到的点击添加按钮button_click代码段无法执行的问题
首先:本人小白一枚,刚入行,如有表述不当的地方,还请多多指教 网页界面如图: 当点击添加按钮后断点测试进入后台代码运行: 代码会先执行Page_Load页面,当加载完后Page_Load代码会跳转到m ...
- jquery点击添加样式,再点击取出样式
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 添加数据源,管理工具--数据源(ODBC),点击添加不显示该驱动
win7系统下或者64位系统下,安装完mysql-connector-odbc驱动后,直接进入:管理工具--数据源(ODBC),点击添加不显示该ODBC驱动 问题解决如下: C:\Users\Admi ...
- Day14 Javascript 点击添加出弹窗,取消隐藏弹窗小练习 反选,全选,取消边框
点击添加出弹窗,取消隐藏弹窗小练习 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta ...
- 解决 Visual Studio 点击添加引用无反应的问题
如遇到vs2010 点击添加引用无反应,主要是因为windows系统推送的更新问题,把windows系统推送的更新都更新一遍就好了. 如果已经安装VS后 Windows系统推荐的更新.360推荐的安全 ...
- OpenLayers学习笔记(三)— QML与HTML通信之 地图上点击添加自由文本
实现在地图随意点击,弹出文本输入框,输入任意文字,完成自由文本添加的功能 作者: 狐狸家的鱼 GitHub:八至 本文链接:地图上点击添加自由文本 关于如何QML与HTML通信已经在上一篇文章 QML ...
- 微信小程序实现给循环列表点击添加类(单项和多项)
在微信小程序里面没有DOM对象, 不能操作DOM. 所有的操作通过数据来实现,下面主要实现了给循环列表点击添加类的操作 一.单项 目标需求:实现下图,给点击的view增加类,每次只能选择一个. 主要思 ...
- js点击添加
1.点击变色 <div id="dd" style="width:100px;height: 100px;background-color: #ccc"& ...
随机推荐
- Python3+BaiduAI识别高颜值妹子图片
一.在百度云平台创建应用 为什么要到百度云平台创建应用,首先来说是为了获取获取access_token时需要的API Key和Secret Key 至于为什么需要API Key和Secret Key才 ...
- weblogic查看版本号教程
1.查看软件版本号 cd /weblogic/bea/wlserver_10.3/server/lib java -cp weblogic.jar weblogic.version 说明:版本号后边的 ...
- Spring控制反转(依赖注入)的最简单说明
1.常规方式实现实例化 1.1已有角色如下: 一个接口Interface,两个接口实现类InstatnceA.InstanceB,一个调用类User 1.2当前实例化InstanceA如下: Inte ...
- C#代码中如何比较两个日期的大小?
C#中比较两个日期大小的方法 /// <summary> /// 比较两个日期大小 /// </summary> /// <param name="dateSt ...
- react router @4 和 vue路由 详解(三)react如何在路由里面定义一个子路由
完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 5.react如何在路由里面定义一个子路由? a.引入在需要子路由的页面引入Rout ...
- 逆袭之旅DAY.XIA.Object中常用方法
2018-07-31
- 双向链表--首页大小不一卡片排序 --- react --- js
1.4中类型(grid_type)的卡片:1:大方块:2:竖长块:3:横长块:4:小方块 var order = 0; // 创建链表 function List(head) { this.head ...
- bs4 CSS选择器
#https://www.crummy.com/software/BeautifulSoup/bs4/doc/index.zh.html#find-all #beautifulSoup可以解析HTML ...
- linux下Mysql多实例实现
什么是MySQL多实例 MySQL多实例就是在一台机器上开启多个不同的服务端口(如:3306,3307),运行多个MySQL服务进程,通过不同的socket监听不同的服务端口来提供各自的服务:: My ...
- Spring框架的四大原则
Spring框架本身有四大原则: 1).使用POJO进行轻量级和最小入侵式开发 2).通过以来注入和基于接口编程实现松耦合 3).通过AOP和默认习惯进行声明式编程 4).使用AOP和模板减少模式化代 ...