How to use angular directives to call dojo DOM man

问题:

I've figured the difference between directive template and templateUrl here The load sequence difference between template and templateUrl in angular directive

My question is how to use Angular and Dojo together.

If I place Dojo widget in templateUrl of angular directive,

FamilySnapModule.directive('homePickdata', function() {
    return  {
        restrict: 'EAC',
        replace: true,
        transclude: true,
        templateUrl: 'familysnap/templates/homePickdata.html'
        //template: '<div id="calendar_month_datepicker" data-dojo-type="dojox.mobile.SpinWheelDatePicker" data-dojo-props=\'slotOrder: [0,1,2], monthPattern: "MM", dayPattern: "dd", align: "center"\'></div>'
        };
    });

familysnap/templates/homePickdata.html

<div id="calendar_month_datepicker" data-dojo-type="dojox.mobile.SpinWheelDatePicker" data-dojo-props='slotOrder: [0,1,2], monthPattern: "MM", dayPattern: "dd", align: "center"'></div>

Then

require([
         "dojox/mobile/SpinWheelDatePicker",
         ], function(dom, ready, registry, SpinWheelDatePicker,SwapView) {
    registry.byId('calendar_month_datepicker'); 
}

will return null.

So how to use angular with dojo together?

回答1:

The directive is dynamically loaded, which means that Dojo will not parse the declarative markup into a widget. It only does that on page load (when configured) or when manually invoked.

So, in order to solve this problem you will have to invoke the Dojo parser when the directive is loaded. You should look at the dojo/parser module.