angularjs directive to angular6 component/directive : <p>I have one angularjs directive as part of old application, I would like to convert that into angular6, As I dont know angularJS and currently working with angular6 version, could anybody please help me with pointer ? below is angularjs code.</p>

<pre><code>define(function (require, exports, module) {
    'use strict';

    var base = require('base');
    var utils = base.utils;

    configCompile.$inject = ['$compileProvider'];
    module.exports = configCompile;

    function configCompile($compileProvider) {

        $compileProvider.directive('projCompile', projCompile);

        function projCompile($compile) {
            return {
                scope: {
                    compile: "=",
                    scope: "=?",
                },
                link: link,
            }

            function link(scope, element, attrs) {
                var scope_child = scope.$new();

                scope.$watch('compile', function () {

                        element.empty().append(scope.compile);
                        $compile(element.contents())(scope_child);
                    }
                );

                scope.$watch('scope', function () {
                        scope.scope = scope.scope || {};
                        scope_child = scope.$new();
                        for (var idx in scope.scope) {
                            scope_child[idx] = scope.scope[idx];
                        }
                        scope_child.$this = scope.scope;

                        element.empty().append(scope.compile);
                        $compile(element.contents())(scope_child);
                    }
                );

            };
        };
    }

})
</code></pre>
