How to use angular factory to create html object and use it view

Question

I need to create html object and pass it in view, as in code below if I use function mentioned in factory directly into the controller it works just fine but I need to reuse the function mentioned in factory at multiple places in-app and I'm trying to avoid repeating same code in my application, I'm kind of new to Angular and stuck at this.

factory:

angular.module('mainApp').factory('RichEditorControl', function () {

    function createRichEdit(richEditContainer) {
        var options = DevExpress.RichEdit.createOptions();
        options.height = '1000px';
        customizeRibbon(options);
        options.confirmOnLosingChanges.enabled = false;

        var elem = document.createElement('div');
        richEditContainer.append(elem);

        var rich = DevExpress.RichEdit.create(elem, options);

        window.rich = rich;

        return rich;
    }

    function customizeRibbon(options) {
        // options.ribbon.removeTab(DevExpress.RichEdit.RibbonTabType.MailMerge);
        options.ribbon.removeTab(DevExpress.RichEdit.RibbonTabType.References);
        options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.File)
            .removeItem(DevExpress.RichEdit.FileTabItemId.OpenDocument);
        options.ribbon.getTab(DevExpress.RichEdit.RibbonTabType.View)
            .removeItem(DevExpress.RichEdit.ViewTabItemId.ToggleShowHorizontalRuler);
    }

})

Controller:

app.controller('AppCtrl',
[
    '$scope', '$http', '$timeout', '$log', '$q', '$location', 'RichEditorControl', function ($scope, $http, $timeout, $log, $q, $location, RichEditorControl) {

        RichEditorControl.createRichEdit($(angular.element('#rich-container')));
    }
]);

View:

<div class="col-md-12">
    <div style="height: 1024px;" id="rich-container"></div>
</div>

Raxel21 · Accepted Answer · 2020-06-11 03:38:57Z

1

I should throw you an error, because a factory must always return an object, try to add this to the beginning of your factory

var service = {
    createRichEdit: createRichEdit,
    customizeRibbon: customizeRibbon,
};

return service;

answered Jun 11, 2020 at 3:38

Raxel21

4132 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to use angular factory to create html object and use it view

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related