<script src="../../angular-1.5.5/angular.min.js"></script>

    <script>

        var myapp=angular.module("myapp",[]);

        myapp.controller("myCtrl",function($scope){

            $scope.items=[];

            $scope.fun=function(event){

                console.log(event);

                if(event.keyCode==13){//判断键值回车键触发input渲染到ul的li中

                    $scope.items.unshift($scope.course);回车键触发input渲染到ul的li中

                    $scope.course="";

                }

            }

        })

    </script>

样式

<body ng-app="myapp" ng-controller="myCtrl" ng-keyup="fun($event)">

<input type="text" ng-model="course">

<ul>

    <li ng-repeat="item in items">{{item}}</li>

</ul>

</body>

angularjs用回车键动态添加数据，同时渲染到页面的更多相关文章

  1. js表单动态添加数据并提交

    情景1:已经存在form对象了,动态为form增加对象并提交 function formAppendSubmit(){ var myform=$('#newArticleForm'); //得到for ...

  2. 【javascript 动态添加数据到 HTML 页面】

    今天简单的学习了一下有关对象字面量的定义和 javascript 如何取出对象字面量的值的知识,javascript 动态添加数据到 HTML 页面的问题. [学习目标]有如下的一组数据通过 Ajax ...

  3. 第27讲 UI组件之 ScrollView与底部动态添加数据

    第27讲 UI组件之 ScrollView与底部动态添加数据 1. ScrollView(滚动视图) ScrollView(滚动视图)是实现滚动的一个控件,只需要将需要滚动的控件添加到ScrollVi ...

  4. Android之ListView动态添加数据（SQLiteOpenHelper类添加数据）

    一.SQLiteOpenHelper类: 这次我们通过sqlite来动态添加数据,接下来我们创建一个openHelper.java,在前面sqlite博客中我们已经详细的讲了SQLite的创建及使用等 ...

  5. Jquery+Ajax实现Select动态添加数据

    https://blog.csdn.net/zhengxiangwen/article/details/46480687 最近在工作中,遇到了一个关于select的问题.一般情况下,select下拉框 ...

  6. ASP.NET网页动态添加数据行

    一看到这标题<ASP.NET网页动态添加数据行>,想起来似乎有点难实现.因为网页的周期性原因,往往在PostBack之后,状态难于有所保留.但Insus.NET又想实现这样的效果,用户点击 ...

  7. 关于devexpress报表XtraReport，动态修改报表样式（.repx格式），动态添加数据并使用的理解

    一.基本概念: XtraReports 中的每个报表都由 XtraRepot 类的一个实例表示,或者由该类的子类来表示(这种情况更常见). 因此,每个报表都作为带区的容器使用,而每个带区中都包含报表控 ...

  8. 抓取Js动态生成数据且以滚动页面方式分页的网页

    代码也可以从我的开源项目HtmlExtractor中获取. 当我们在进行数据抓取的时候,如果目标网站是以Js的方式动态生成数据且以滚动页面的方式进行分页,那么我们该如何抓取呢? 如类似今日头条这样的网 ...

  9. AngularJS：实现动态添加输入控件功能

    功能要求如下:1.    点击加号可以增加输入框.2.    点击减号可以减少输入框.3.    当输入框只有一个的时候,不能再减少输入框.效果图如下:只有一个输入框有多个输入框 要实现这个功能,可以 ...

随机推荐

  1. day03运算符、表达式、自增自减、三目运算符、程序结构、用户输入

    复习 1.java的输出语句 1)System.out.println(); 2)System.out.print(); 2.注释 1)单行注释 // 2)多行注释 /* .... */ 3.变量 1 ...

  2. Aery的UE4 C++游戏开发之旅（3）蓝图

    目录 蓝图 蓝图命名规范 蓝图优化 暴露C++至蓝图 暴露C++类 暴露C++属性 暴露C++函数 暴露C++结构体/枚举 暴露C++接口 蓝图和C++的结合方案 使用继承重写蓝图 使用组合重写蓝图 ...

  3. JavaScript-作用域与作用域链

    一.JavaScript作用域:    1.就是代码名字(变量)在某个范围内起作用和效果,目的是为了提高程序的可靠性更重要是减少命名冲突. 2.js的作用域(es6)之前,分为全局作用域.局部作用域 ...

  4. AI行业精选日报_人工智能（12·18）

    百度Apollo升级自动驾驶平台,发布车路协同.智能车联两大平台 12 月 18 日消息,Apollo 发布了全球首个点到点城市自动驾驶开放能力.自动驾驶云.新一代智能交通解决方案.小度车载 2020 ...

  5. RabbitMQ 备份交换机（alternate-exchange）介绍

    RabbitMQ之备份交换机(alternate-exchange) 1.备份交换器,AlternateExchange(AE) 备份交换器是为了实现没有路由到队列的消息,声明交换机的时候添加属性al ...

  6. 利用PyInstaller打包exe文件

    前言 平常我们通过Python写完一些小脚本之后,如果使用不频繁的话,一般会选择在DOS界面直接跑脚本,或者在IDE中运行.但当我们需要频繁使用某些脚本,或者在没有Python环境的机器上也能顺利运行 ...

  7. pillow模块Image.crop()函数切割图片方法，参数说明

    使用Image.crop()方法对图片进行切割. 参数: Image.crop(left, up, right, below) left:与左边界的距离 up:与上边界的距离 right:还是与左边界 ...

  8. [转]smtplib.SMTPDataError: (554, b'DT:SPM的异常

    本文转自:https://blog.csdn.net/mapeifan/article/details/82428493 python 发送邮件,出现如下异常 异常如下: smtplib.SMTPDa ...

  9. MySQL数据库：运算符

    运算符 比较运算符: > 大于 < 小于 >= 大于等于 <= 小于等于 = 等于 != 不等于 范围运算符: between...and...(包含边界值) 类似于 > ...

  10. Java_可变参数类型

    Java方法中的可变参数类型,也称为不定参数类型,是一个非常重要的概念 举栗子 public class TestVarArgus { public static void dealArray(int ...