最终找到了如何使用ng2-file-upload的方法。以下代码是编辑器组件的一部分,我定义了tinyMCE的东西。我只会展示最重要的部分。
HTML:
<textarea id="{{elementId}}"></textarea>
<input id='input' type="file" #fileInput ng2FileSelect [uploader]="uploadFile.uploader" style="display: none;"
accept="image/png,image/gif,image/jpeg"/>
打字稿:
ngOnInit() {
this.uploadFile.uploader.onCompleteItem = (item: any, response: string, status: any, headers: any) => {
....
tinymce.activeEditor.insertContent('<img src="' + location + '"/>');
....
};
}
ngAfterViewInit() {
tinymce.init({
.....
setup: editor => {
this.editor = editor;
editor.on('keyup',() => {
const content = editor.getContent();
this.onEditorKeyup.emit(content);
});
editor.on('reset', function(e) {
editor.setContent('');
});
editor.addButton('mybutton', {
text: 'Image',
icon: 'image',
onclick: function() {
var input = document.getElementById('input');
input.click();
}
});
},
.....
}
不是很花哨,只是打开文件选择器上单击,然后上传(需要设置上传到autoupload),但它是足够的我。 “
''我已经在我的应用程序中成功地使用了ng2-file-upload,但TinyMCE不支持打字稿,因此我无法在那里使用它。” - TinyMCE在浏览器中运行,并且没有浏览器可以实际运行TypeScript。在传送到Web浏览器之前,它们都会被编译为JavaScript。 –
@MichaelFromin我的意思是,我不能只使用自定义按钮,并在html下的editor.windowManager.open:使用Angular和利用打字稿。 – BadHabits