svelte.directive.js

/**
 * Useage:
 *   <svelte component="MySvelteComponent" all-props="allPropsFromAngularJS"></svelte>
 * 
 */
(function() {
    'use strict';

    angular
        .module('myapp')
        .directive('svelte', svelteDirective);

    function svelteDirective() {
        return {
            restrict: "E",
            scope: {
                component: '=',
                allProps: '=',
            },

            compile: function compile(tElement, tAttrs, transclude) {
                return {
                    pre: function preLink(scope, iElement, iAttrs, controller) {
                        var Component;
                        var attrKeys = Object.keys(iAttrs.$attr);

                        if (attrKeys.length > 0) {
                            attrKeys.forEach(function (key) {
                                if (iAttrs.$attr[key] === 'component') {
                                    Component = scope[key];
                                }
                            });
                        }

                        if (!Component) {
                            throw Error('You must supply a component to svelte directive.');
                        }

                        var component = new Component({
                            target: iElement[0],
                            props: scope.allProps,
                        });

                        // Attempting to get binding working:
                        console.log('************************', scope.allProps.noteCount, component);
                        scope.$watch('allProps', function (newVal, oldVal) {
                            console.log('************************',newVal, oldVal, scope.allProps.noteCount, component);
                            component.set(newVal);
                        }, true);
                        /*
                        scope.$watch("allProps.noteCount", function (newVal, oldVal) {
                            console.log('************************',newVal, oldVal, scope.allProps.noteCount);
                        });*/
                    }
                };
            }
        };
    }

})();