<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的更多相关文章

  1. 高度自适应的div

    需求:有一个高度自适应的div,里面有两个div,一个高度100px,希望另一个填满剩下的高度 1.用flex 来实现 思路:flex 垂直布局(column),第一个元素固定高度,第二个元素flex ...

  2. 四种方法解决DIV高度自适应问题

    本文和大家重点讨论一下解决DIV高度自适应的方法,这里主要从四个方面来向大家介绍,相信通过本文学习你对DIV高度自适应问题会有更加深刻的认识. DIV高度自适应 关于DIV高度的自适应,一直是个让人头 ...

  3. div模拟textarea文本域轻松实现高度自适应

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. flex布局嵌套之高度自适应

    查遍各大资源无任何flex嵌套布局的例子,经过自己折腾完成了项目中的高度自适应需求(更多应用于前端组件) 效果图: html代码:(关键地方已经用颜色特别标识 ^_^) <!DOCTYPE ht ...

  5. div仿textarea使高度自适应

    今天真的有些无语,在百度上找了很多关于textarea和input高度自适应的代码,并且考虑到了要判断textarea的滚动条,从而动态改变它的高度,直到我搜索了这个让我目瞪狗呆的办法…… <d ...

  6. uitableviewcell高度自适应笔记

    今天看了几篇uitableviewcell高度自适应的文章,大体分为两种方式. 第一种方式,cell里面有label,在cellforrow绘制的时候计算Label的可能高度,并且在此时重新计算cel ...

  7. textarea高度自适应问题

    textarea中的文字如果过多,就会产生滚动条,一本分文本被遮盖住,不能看到所有的文本. 那么,如何才能让textarea的高度随输入内容多少,可以自动的改变高度呢? 解决思想: 1 利用conte ...

  8. 使用div模拟textarea,实现文本输入框高度自适应(附:js控制textarea实现文本输入框高度自适应)

    一.使用textarea标签进行多行文本的输入有很多限制,比如不能实现高度自适应,会出现难看的滚动条等问题. HTML5中添加了一个新属性contenteditable,该属性可以让input,tex ...

  9. textarea如何实现高度自适应?

    今天需要些一个回复评论的页面,设计师给的初始界面就是一个只有一行的框.然后当时就想这个交互该怎么实现比较好,然后想起了新浪微博的做法:点击评论,默认显示一行,当输入的文字超过一行或者输入Enter时, ...

随机推荐

  1. emWin 2天速成实例教程000_如何快速入门ucGUI/emWin

    备注:(1)打开工程目录下的"Exe\GUISimulationDebug.exe"即可看到效果.(2)看完教程000-005就基本会用emWin做项目,其他章节可以需要时再参考. ...

  2. javscript eval()的优缺点与web安全防范

    要说JavaScript中最为强大的一个方法便是eval()方法呢,为何如此说呢?因为它就像是一个JavaScript解析器,也就是说它的参数就是一段js代码所构成的字符串,当执行这个函数的时候,会把 ...

  3. mybatis快速入门(六)

    前面mybatis的入门程序基本上都写完了,就看大家的灵活运用了,今天来吧前面的整合一下封装一个公共的BaseDao 只需要把前面的改造下然后创建一个BaseDao的接口,其它的继承BaseDao接口 ...

  4. 【HAOI2009】毛毛虫

    题面 题目描述 对于一棵树,我们可以将某条链和与该链相连的边抽出来,看上去就象成一个毛毛虫,点数越多,毛毛虫就越大.例如下图左边的树(图 1 )抽出一部分就变成了右边的一个毛毛虫了(图 2 ). 输入 ...

  5. [BZOJ4872][六省联考2017]分手是祝愿

    BZOJ Luogu sol 首先发现肯定有解,又因为每个位置至多操作一次,所以最优解一定是在\([0,n]\)之间 有一种可以在\(O(\sum_{i=1}^{n}\lfloor\frac{n}{i ...

  6. [APIO2015]八邻旁之桥

    题面在这里 sol 这是一个\(Splay\)的题解 首先,如果一个人的家和办公室在同一侧,我们可以直接预处理; 如果不在同一侧,也可以加上1(当然要过桥啦) 当k==1时 我们设桥的位置为\(pos ...

  7. AngularJS中Model和Controller传值问题

    最近由于工作原因,开始写点前端的东西.前两天刚开始了解AngularJS这门技术,当然,新手免不了会爬坑! 今天分享一篇关于--> 模型传参给Controller的实例: 需求: 具体是  首先 ...

  8. angular路由详解三(路由参数传递)

    我们经常用路由传递参数,路由主要有三种方式: 第一种:在查询参数中传递数据 {path:"address/:id"}   => address/1  => Activa ...

  9. mvc-dispatchar-servlet.xml文件报错

    <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...

  10. 使用MBROSTool 工具制作本地硬盘多启动盘的方法总结

    前段时间写了一个自用五合一多启动盘分享--分别用来维护娱乐,wifi密码破解,win&mac登陆密码绕过/清除,反馈的同学还是挺多,觉得大家都有这方面的需求,于是再把自己的使用经验总结一下. ...