指令-arContentedit-可编辑的高度自适应的div
<div ar-contentedit="true" contenteditable="true" contenteditable="plaintext-only" class="form-control textareaResize whiteSpace " ></div>
/**
* by luo.chunxiang@eisoo.com-2016-10-26
*/ define(function (require) { require('ui/modules')
.get('kibana')
.directive('arContentedit', function () {
return {
restrict: 'A', // 只用于属性
require: '?ngModel', // get a hold of NgModelController
link: function (scope, element, attrs, ngModel) {
if (!ngModel) {
return;
}
// Specify how UI should be updated
ngModel.$render = function () {
element.text(ngModel.$viewValue || '');
};
// Listen for change events to enable binding
element.on('blur keyup change', function () {
scope.$apply(readViewText);
});
// No need to initialize, AngularJS will initialize the text based on ng-model attribute
// Write data to the model
function readViewText() {
var html = element.text();
// When we clear the content editable the browser leaves a <br> behind
// If strip-br attribute is provided then we strip this out
if (attrs.stripBr && html === '<br>') {
html = '';
}
ngModel.$setViewValue(html);
}
}
};
});
});
指令-arContentedit-可编辑的高度自适应的div的更多相关文章
- 高度自适应的div
需求:有一个高度自适应的div,里面有两个div,一个高度100px,希望另一个填满剩下的高度 1.用flex 来实现 思路:flex 垂直布局(column),第一个元素固定高度,第二个元素flex ...
- 四种方法解决DIV高度自适应问题
本文和大家重点讨论一下解决DIV高度自适应的方法,这里主要从四个方面来向大家介绍,相信通过本文学习你对DIV高度自适应问题会有更加深刻的认识. DIV高度自适应 关于DIV高度的自适应,一直是个让人头 ...
- div模拟textarea文本域轻松实现高度自适应
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- flex布局嵌套之高度自适应
查遍各大资源无任何flex嵌套布局的例子,经过自己折腾完成了项目中的高度自适应需求(更多应用于前端组件) 效果图: html代码:(关键地方已经用颜色特别标识 ^_^) <!DOCTYPE ht ...
- div仿textarea使高度自适应
今天真的有些无语,在百度上找了很多关于textarea和input高度自适应的代码,并且考虑到了要判断textarea的滚动条,从而动态改变它的高度,直到我搜索了这个让我目瞪狗呆的办法…… <d ...
- uitableviewcell高度自适应笔记
今天看了几篇uitableviewcell高度自适应的文章,大体分为两种方式. 第一种方式,cell里面有label,在cellforrow绘制的时候计算Label的可能高度,并且在此时重新计算cel ...
- textarea高度自适应问题
textarea中的文字如果过多,就会产生滚动条,一本分文本被遮盖住,不能看到所有的文本. 那么,如何才能让textarea的高度随输入内容多少,可以自动的改变高度呢? 解决思想: 1 利用conte ...
- 使用div模拟textarea,实现文本输入框高度自适应(附:js控制textarea实现文本输入框高度自适应)
一.使用textarea标签进行多行文本的输入有很多限制,比如不能实现高度自适应,会出现难看的滚动条等问题. HTML5中添加了一个新属性contenteditable,该属性可以让input,tex ...
- textarea如何实现高度自适应?
今天需要些一个回复评论的页面,设计师给的初始界面就是一个只有一行的框.然后当时就想这个交互该怎么实现比较好,然后想起了新浪微博的做法:点击评论,默认显示一行,当输入的文字超过一行或者输入Enter时, ...
随机推荐
- CentOS时钟同步服务器
①本地时钟服务器需要安装chrony服务,可以通过yum.rpm.源码包安装,chrony支持C/S模式 ②编辑本地时钟服务,使其指向提供标准时间服务器,例如:中国国家授时中心NTP服务器. 修改配置 ...
- 网页加载进度的实现--JavaScript基础
总结了一些网页加载进度的实现方式…… 1.定时器实现加载进度 <!DOCTYPE html><html lang="en"><head> < ...
- 【转载】Java并发编程:volatile关键字解析(写的非常好的一篇文章)
原文出处: 海子 volatile这个关键字可能很多朋友都听说过,或许也都用过.在Java 5之前,它是一个备受争议的关键字,因为在程序中使用它往往会导致出人意料的结果.在Java 5之后,volat ...
- 【BZOJ1857】传送带(三分)
[BZOJ1857]传送带(三分) 题面 Description 在一个2维平面上有两条传送带,每一条传送带可以看成是一条线段.两条传送带分别为线段AB和线段CD.lxhgww在AB上的移动速度为P, ...
- LightOJ1336 Sigma Function
题意 求和运算是一种有趣的操作,它来源于古希腊字母σ,现在我们来求一个数字的所有因子之和.例如σ(24)=1+2+3+4+6+8+12+24=60.对于小的数字求和是非常的简单,但是对于大数字求和就比 ...
- [ZJOI2006]书架(树状数组水过)
这道题显然平衡树,splay,treap什么的随便切 然而我不想打,决定水过这道题 把空间开3倍,树状数组维护它前面的树的个数,开个id数组记录位置 找一个数排名直接二分加求前缀和,log^2的搞一搞 ...
- 好用的sitemap生成器—GY SiteMap
好用的sitemap生成器-GY SiteMap 下载地址:http://www.wyxxw.cn/download-detail-6-8-14.html 网站地图可以更好的帮助搜索引擎抓取.收录网站 ...
- 详解MySQL数据类型
原文地址http://www.cnblogs.com/xrq730/p/5260294.html,转载请注明出处,谢谢! 前言 很久没写文章,也有博友在我的有些文章中留言,希望我可以写一些文章,公司项 ...
- javascript 特殊的面向对象以及继承详解(入门篇)
学习Javascript人,大多听说一句话叫js里面一切都是对象.我刚开始接触javascript面向对象编程时候,挺乱的,我当时习惯性的把PHP的面像对象思想套用在js上面,其实js的面向对象与传统 ...
- c#多线程同步之EventWaitHandle使用
有这么一个场景,我需要借助windows剪贴板把数据插入到word域中. 实现步骤: 1.把剪贴板数据保存到变量. 2.使用剪贴板实现我们的业务. 3.把变量里的数据存回剪贴板. 但是结果却令人诧异, ...