求助bootstrap表单设计器-markdown编辑器引入后无法预览

  EpicEditor 是一款可以嵌入到网页中的 JavaScript Markdown 编辑器,支持全屏编辑、在线预览、自动保存草稿,离线支持等等。对于开发人员,它提供了一个健壮的API,可以很容易定制主题并允许你灵活使用绑定的 Markdown 解析器。
本文链接:
编译来源:
未经允许不得转载: &markdown + bootstrap 邮件客户端
有没有实现了markdown和bootstrap的基于webkit的邮件客户端 或者直接web的邮件客户端?
2013年 10月2日
(647 威望)
请输入验证码:
[captcha placeholder]
或 后不会被要求输入验证码。
如果我的答案被选中或被评论,请通过一下邮箱通知我:
隐私保护: 您的邮箱仅用于发送系统通知。
请输入验证码:
&&&& 或 后不会被要求输入验证码。
提一个问题:
2014年 11月12日
(544 威望)
2012年 12月1日
(528 威望)
2014年 10月30日
(647 威望)
2015年 9月29日
(642 威望)
2015年 8月19日
(692 威望)
欢迎访问随意问技术百科,为了给您提供更好的服务,请及时反馈您的意见。angular模板加载 ----ng-template
Angularjs作为mvc(或者说mvvm)框架,同样具备模板这一基本概念。
NG加载模板的顺序为
内存加载---AJAX加载。
如果之前使用过Bootstrap 插件的ng版,即angular-ui,就会了解到这种方式的具体应用。模板本质上是字符串,把字符串直接写入内存,加载时直接从内存获取,速度会更快,有两种方式显式启用内存加载。
通过使用$templateCache service来实现
angular.module('myApp', [])
.controller('myCtrl', ['$scope','$templateCache', function($scope,$templateCache){
var tmp = '&h4&lovestory&/h4&'
+ '&p&这是直接调用$templateCache服务获取模板文件的方式&/p&'
+ '&a href=""&服务启用templateCache方式&/a&';
$templateCache.put('lovestory.html',tmp);
$templateCache服务put方法负责向内存写入模板内容。
通过script标签引入
&script type="text/ng-template" id="lovestory.html"&
&h4&lovestory&/h4&
&p&这是script标签获取模板文件的方式&/p&
&a href=""&标签启用templateCache方式&/a&&/script&
这里需要注意,type="text/ng-template"是指明这是ng模板,id属性是指实际使用模板时的一个引用,标签之间的内容才是实际的模板内容。而且,需要注意,id绝对不是URL,这个script标签绝对不会发出HTTP请求,具体讨论见最后。
实际应用模板时候,使用ID属性,即可从内存中获取对应数据。
ng-include="'lovestory.html'" class="well"
使用ng-include的时候,应该注意,id相当于一个字符串,不是ng-expression,所以不要忘了加单引号。
上述的内存加载,相当于一个预定义模板,定义在client-side,不会与服务器有任何交互,适合变化频率低的模板。
当NG在内存中找不到对应模板时,就会启用AJAX请求,去拉取对应模板。假设项目入口文件地址为;
ng-include="'lovestory.html'" class="well"
在指令中同样可以使用,templateUrl对应值
angular.module('myApp', [])
.directive('templateDemo', ['$log', function($log){
restrict: 'A', // E = Element, A = Attribute, C = Class, M = Comment
templateUrl: 'butterfly.html',
replace: true,
link: function($scope, iElm, iAttrs, controller) {}
内存中没有对应模板时,AJAX请求地址为, 请求成功后将对应内容写入$templateCache,在页面不进行刷新,不手动删除的情况下,写入的内容不会丢失。而且,务必记住,AJAX是有缓存控制的。。。
内存模板优点
在雅虎前端优化34条里,有一条是“合并压缩文件”。
合并压缩文件可以减小HTTP请求量,又可以减小网络传输量,对于路径依赖并不严重的JS,CSS文件完全是必备,因为各JS,CSS文件开发时分割为不同的文件,实现各自的功能需求,上线时合并即可,但是,HTML文件可以压缩,但是无法合并,因为路径依赖严重。
以我为学习Angularjs而做的个人博客练习
路由为例:
angular.module('administratorApp',[])
.config(function ($routeProvider,$locationProvider) {
$locationProvider.html5Mode(false);
$routeProvider
.when('/manage', {
templateUrl: 'views/manage.html',
controller: 'ManageCtrl'
.when('/diary/:key', {
templateUrl: 'views/diaryDetail.html',
controller: 'DiaryDetailCtrl',
.when('/diary', {
templateUrl: 'views/diaryList.html',
controller: 'DiaryListCtrl'
.when('/publish/:key', {
templateUrl: 'views/update.html',
controller: 'UpdateCtrl'
.when('/publish', {
templateUrl: 'views/publish.html',
controller: 'PublishCtrl'
.when('/record', {
templateUrl: 'views/record.html',
controller: 'RecordCtrl'
.otherwise({
redirectTo: '/diary'
六个控制器需要六个模板,六次HTTP请求加载数据量并不大的模板资源浪费严重。NG的优化方案是,通过虚拟路径取代实体路径,去除掉server-side的路径依赖。
好处就是,一个JS文件一次HTTP请求,而不是六次。坏处就是内存压力变大,PC上无所谓,开发web app(mobile)就需要注意几点。
移动端内存太脆,尽量不要使用上述所说的预定义模板,因为模板会全部加载到内存中
AJAX请求完毕,会自动把结果放入cache里,所以需要手动控制.模板与控制器存在对应关系,可以在控制器内部加上如下代码
$scope.$on('$locationChangeStart',function(){
$templateCache.remove('****.html');})
$routeProvider的template,templateUrl可以是函数,通过函数返回值可以控制模板加载。
PS::本人并未涉及到移动端开发,所以此处为思考所得,而且随着手机硬件性能提升,内存不再是个困扰。
$templateCache 方法
$templateCache基于cacheFactory而来,接口保持一致,可以认为
$templateCache = $cacheFactory('template');
向内存写入模板内容
从内存获取模板内容
传入key值,删除对应模板内容
删除所有模板内容
解除key-value对应关系,但不释放内存
模板缓存对象的信息
Grunt与ID属性误解
module.exports = function(grunt){
grunt.initConfig({
html2js : {
simple : {
options : {
base : '',
module : 'templateStore'
files : [{
: ['views/*.html'],
dest : 'build/scripts/templateStore.js'
grunt.loadNpmTasks('grunt-html2js');
grunt.registerTask('default',['html2js']);}
这是我目前使用Grunt--html2js的配置方案,目的是将views文件夹下的所有模板文件全部放入templateStore模块中,各模板对应ID即为路径,生成的部分代码如下:
angular.module("views/diaryList.html", []).run(["$templateCache", function($templateCache) {
$templateCache.put("views/diaryList.html",
'*******'}]);
这部分代码等效于
&script type="text/ng-template" id="views/diaryList.html"&
***********&/script&
现在应该明白,id只是个标示,不是URL。。。。。。
涉及到部分HTTP Header 和 XHR2
的相关内容,将作为单独篇章出现。
如有不妥之处,QQ
与我联系,会尽快修正。
如果同为Angularjs的爱好者,QQ群: Angularjs中文社区。
添加新批注
在作者公开此批注前,只有你和作者可见。
查看更早的 5 条回复}

我要回帖

更多关于 bootstrap表单设计器 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信