невозможно создать таблицу со строкой заголовков и добавить данные Dynami c в заголовки и ячейки данных в ckeditor 5 и angular 9 - PullRequest
Новая
       39

невозможно создать таблицу со строкой заголовков и добавить данные Dynami c в заголовки и ячейки данных в ckeditor 5 и angular 9

0 голосов
/ 04 мая 2020

Я хочу создать таблицу в Ckeditor 5, которая должна содержать строку заголовка и строку данных. Я попытался editor.execute, чтобы создать таблицу со строкой заголовка, и это было нормально, но я не знаю, как заполнить данные заголовком и ячейками данных программным способом. 

editor.execute('insertTable', {rows: 2, columns: 4});
editor.execute('setTableRowHeader');

Я также пытался Плагин TableUtils, я мог бы создать таблицу и заполнить ее своими данными, но я не знаю, как сделать мою первую строку в качестве заголовка с помощью этого метода. 

const tableUtils = this.editor.plugins.get('TableUtils');
this.editor.model.change(writer => {
const table = tableUtils.createTable(writer, 2, result.length);

result.forEach((column, index) => {
        writer.insertText(`${column.Name}`, {bold: true}, 
        table.getChild(0).getChild(index).getChild(0), 0);
        writer.insertText(`{Tag.Embed.${column.Name}}`, 
        table.getChild(1).getChild(index).getChild(0), 0);
  });
  this.editor.model.insertContent(table);
});

Есть ли какое-либо решение, чтобы исправить каждый из вышеперечисленных способов я пробовал? спасибо.

1 Ответ

0 голосов
/ 06 мая 2020

Я нашел ответ благодаря ребятам из службы поддержки CKEditor. 

const model = editor.model;

model.change( writer => {
// Create a table.
const table = tableUtils.createTable( writer, 2, 2 );
// Set it's "headingRows" attribute to 1.
writer.setAttribute( 'headingRows', 1, table );

// To simplify we'll take the first (only) data row.
const dataRow = table.getChild( 1 );

for ( const tableCell of dataRow.getChildren() ) {
    // Each created table cell have an empty paragraph as a child.
    const paragraph = tableCell.getChild( 0 );

    // Crete a content to insert - here just "foo" text.
    const text = writer.createText( 'foo' );

    // Insert text to a paragraph.
    const insertPosition = writer.createPositionAt( paragraph, 0 );
    writer.insert( text, insertPosition );
}

// Use model.insertContent() to insert a created content.
// It will insert table at a current document selection position.
model.insertContent( table );
} );
...