VueJS在内联模板组件中重新编译HTML
VueJS re-compile HTML in an inline-template component
我已经包装了bootstrapTable(https://github.com/wenzhixin/bootstrap-table)转换为指令,如以下所示:
Vue.directive('bootstraptable', {
priority: 1000,
params: ['url', 'resource-name'],
bind: function () {
var _self = this;
$(this.el)
.bootstrapTable({
pagination: true,
pageSize: 15,
pageList: [],
sidePagination: 'server',
url: this.params.url,
queryParams: function (params) {
return params;
},
cookie: true,
cookieExpire: '24h',
cookieIdTable: this.params.resourceName + '-table',
locale: 'it-IT'
}).on('load-success.bs.table', function (e, data) {
$('[data-toggle="tooltip"]').tooltip();
_self.vm.$compile(_self.vm.$el);
});
},
update: function (value) {
$(this.el).val(value)
},
unbind: function () {
$(this.el).off().bootstrapTable('destroy')
}
});
从服务器返回的JSON包含一个带有v-on指令的按钮,因此我必须重新编译注入的HTML行,以使按钮指令正常工作。无论如何,以下代码似乎不起作用:
_self.vm.$compile(_self.vm.$el);
我是不是错过了一些显而易见的东西?
我改了行:
_self.vm.$compile(_self.vm.$el);
带有:
_.each($('[recompile]'), function(el){
_self.vm.$compile(el);
});
并为所有需要重新编译的HTML元素添加了属性"recomplete"。
这似乎如预期的那样有效,如果有更传统的方法,请毫不犹豫地回答。
相关文章:
- AngularJS指令出错-无法读取属性'编译'的未定义
- 如何使用ViewCompiler手动编译DOM的一部分
- 预编译的车把模板使文件大小加倍
- Mocha react本地路由器编译错误
- Babel编译错误:找不到模块核心js/library/fn/get迭代器
- 在编译阶段后创建新的DOM树,或者继续使用原始修改的DOM
- 如何在Windows中将Javascript文件编译成二进制文件
- 浏览器是否持久缓存脚本元素的编译版本
- GWT:有没有一种方法可以修改GWT在编译中使用的Cast.java文件
- 使用脚本#编译代码(独立)
- 是否可以使用有角度的HTML文档进行$编译
- 使用Gulp手柄部分编译为单个HTML文件
- AngularJS:带有HTML和angular表达式的指令;编译”;具有外部范围的内容
- Javascript赢得'不能在IE上编译,但可以在Chrome上运行
- Bootstrap CSS和JS我必须将它们包含在单独的文件中,或者可以编译它们
- 获取模板是用我的Node.JS应用程序的新版本Handlebars错误预编译的
- 在 Angular 中,当我收到一些新数据时,如何强制模板重新编译
- 如何编译angular指令中的新元素.attr()
- 如何创建一个新指令来编译Angularjs中的其他指令属性
- 未编译angular指令中新添加的元素