CODEWITHSUNDEEP
angularoffice365office-js
vimalDev
vimalDev

Reputation: 452

Office.js API - Add nested content control in word file

I am developing an plugin for Office Word, I want to add feature that allows user to add content in hierarchical order in form of nested content control.

        let wordContentControl:any;
        Word.run(async context => {
           
            const range = context.document.getSelection();
            range.clear();
            wordContentControl = range.insertContentControl();
            wordContentControl.tag = "NameTest";
            wordContentControl.insertText("Sample", 'End');
            wordContentControl.cannotEdit = false;
            wordContentControl.appearance = 'BoundingBox';

            wordContentControl.font.color = 'red';
            await context.sync()


        }).catch((error) => {
            console.log(error);
        });
        Word.run(async context => {
            var contentControlsWithTag = context.document.contentControls.getByTag('NameTest');
            // Queue a command to load the tag property for all of content controls.
            context.load(contentControlsWithTag, 'tag');

            // Synchronize the document state by executing the queued commands,
            // and return a promise to indicate task completion.
            return context.sync().then(function () {
                if (contentControlsWithTag.items.length === 0) {
                    console.log('No content control found.');
                }
                else {
                    return context.sync()
                        .then(function () {
                           
                            context.sync();
                            var ccs = context.document.contentControls;
                            
                            ccs.load("NameTest");
                            
                            console.log("Nr cc: " + ccs.items.length);
                            let cc = ccs.items[0];

                        });
                }
            });
        });

This is what I have done so far. but I am unable to find a way to add content control within/nested content control. Your help would be much helpfull for me.

enter image description here

Upvotes: 0

Views: 340

Answers (1)

chiz-ms
chiz-ms

Reputation: 136

I tested and calling insertContentControl inside a content control should work:

var contentControl = context.document.getSelection().insertText('outer\n', Word.InsertLocation.start).insertContentControl();
contentControl.insertText('inner', Word.InsertLocation.end).insertContentControl();

Result screenshot

Please see if this works for you.

Upvotes: 1

Related Questions