javascript - Passing an object to a dynamically created directive -

i'm trying simple, pass object dynamically created directive. in short, use button directive which, on click, uses $compile produce template containing directive element. want pass object directive's attribute.

angular.element(document.getelementbyid('dircontainer')).append($compile("<my-dynamic-directive name='data.name' data='data'></my-dynamic-directive>")(scope)); 

fiddle works angular 1.2 not angular 1.3! can't find relevant documentation change.

jsfiddle: http://jsfiddle.net//weso9huo/ (angular dep in external resources)

edit fiddle 1.2. changing 1.3 breaks it.

edit 2 fiddle http://jsfiddle.net/7jjfadun/ angular 1.3 doesn't work.

any ideas?

you getting following error

error: [ng:areq] argument 'mainctrl' not function, got undefined http://errors.angularjs.org/1.3.15/ng/areq?p0=mainctrl&p1=not%20a%20function%2c%20got%20undefined

angular 1.3+ no longer supports controller declaration on global scope. apart code works.

myapp.controller('mainctrl', function ($scope) {     $scope.data = {         id: 666,         name: "fabruce"     } }); 

demo

---

function mainctrl($scope) {     $scope.data = {         id: 666,         name: "fabruce"     } }  mainctrl.$inject = ['$scope']; myapp.controller('mainctrl', mainctrl); 

demo 2