<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. github克隆项目缓慢

    github浏览或者克隆项目的时候,总是十分缓慢,下面是亲自自测的一种方式,克隆速度可以稍快一些 第一步 访问域名解析网站:https://www.ipaddress.com/ 在网页下方可以看见一个 ...

  2. 剑指offer-47：不用加减乘除做加法

    参考:https://www.cnblogs.com/zhangziqiu/archive/2011/03/30/ComputerCode.html <原码,反码,补码 详解> 题目描述 ...

  3. IEEE754 32位浮点数表示范围

    6.1浮点数的数值范围 根据上面的探讨,浮点数可以表示-∞到+∞,这只是一种特殊情况,显然不是我们想要的数值范围. 以32位单精度浮点数为例,阶码E由8位表示,取值范围为0-255,去除0和255这两 ...

  4. 初识微信小程序

    一.简介 微信小程序是运行在微信环境中的应用,它只能在微信中运行,不能运行在浏览器等其他环境中,微信团队提供了专门的开发工具用于微信小程序的开发,还提供了丰富的API,让我们的小程序能够具备与手机设备 ...

  5. DataGridView使用BindingNavigator实现简单分页功能

    接上一篇<DataGridView使用自定义控件实现简单分页功能>,本篇使用BindingNavigator来实现简单分页功能.其实也只是借用了一个BindingNavigator空壳, ...

  6. Flask 模板语言，装饰器

      Jinja2模板语言 # -*- coding: utf-8 -*-   from flask import Flask, render_template, request, redirect,  ...

  7. [springMvc]常见配置

    [springMvc]常见配置 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns=&qu ...

  8. Tornado 框架

    Tronado为何物 Tornado全称Tornado Web Server,是一个用Python语言写成的Web服务器兼Web应用框架,由FriendFeed公司在自己的网站FriendFeed中使 ...

  9. ORA-00904:"WM_CONCAT":标识符无效

    原创 Oracle 作者:Root__Liu 时间:2019-11-21 18:49:27  514  0 今天客户现场业务甩给我一个报错让处理,ora-00904:"WM_CONCAT&q ...

  10. 创建可执行的JAR包并运行

    将一个应用程序制作成可执行的JAR包,通过JAR包来发布应用程序.创建可执行JAR包的关键在于:让java -jar命令知道JAR包中哪个类是主类,java -jar命令可以通过运行该主类来运行程序. ...