debonet / angular-macros

An AngularJS module that allows for macro definition and invocation. Can be used to form the basis for website templating in a purely Angular way.
MIT License
3 stars 2 forks source link

Macro broken with newer angularjs versions #1

Open pakal opened 9 years ago

pakal commented 9 years ago

The example files work well with the old angularjs, but with v1.2.19 it breaks when using invoke:

Error: Syntax error, unrecognized expression: this is a simple example of a macro

        substitutions: {{variable1}}, {{variable2}}

        and inner content: <span ng-bind-html-unsafe="content"></span>

        and content subselection: <span ng-bind-html-unsafe="content|find:b"></span>
pakal commented 9 years ago

OK found, it's due to the way that jQuery (when used with angularjs, and thus becoming their "jQlite" support), has changed in 1.9, and now mixes up raw html strings for "jquery selectors", stuff that the real jqlite doesn't do (because it doesn't support selectors).

Here is a quick and dirty workaround ; I didn't manage to find better utils, in angularjs toolkit, to force conversion of an html fragment to an "angular.element". Any idea ?

                    // function to render the macro, used initially and on redefinitions
                    var fRender = function(){
                        fTransclude(function(eClone){
                            scope.content = eClone;
                        });

                        var sMacro = scope.$eval(attrs['macro']);

                        var rawData = asHtmlTemplateForMacro[sMacro];

                        if (angular.element.parseHTML) {
                            rawData = angular.element.parseHTML(rawData);  // workaround for bug where jQuery (when used) mistakes text for a selector
                        }

                        var compiledData = $compile(rawData, fTransclude)(scope);

                        jq.html(compiledData);
                    };