I have written directive which takes the directive name in parameter and load that directive dynamically as fallow:
.directive("loadDirective", function($compile, $timeout) {
return {
restrict: 'E',
scope: {
Dtype: '=type',
subType: '@',
data: "=data"
},
link: function(scope, element) {
scope.$watch('Dtype', function() {
$timeout(function() {
var generatedTemplate = '<div ' + scope.Dtype + (scope.subType ? '-' + scope.subType + '-directive' : '-directive') + ' data="data" >dd</div>';
element.empty().append($compile(generatedTemplate)(scope));
})
})
},
};
})
here is my one of the directive which I will be loading it dynamically
.directive("dailyIntervalDirective", function() {
return {
scope: {
data: '='
},
restrict: 'A',
templateUrl: '/flat-ui/tpls/daily-interval.html'
};
})
now I am trying to write test case for the loadDiretive to test it load the directive or not as follow:
describe("loadDirective directive", function() {
var elm, scope;
beforeEach(module('guideApp.directives'));
beforeEach(module('/flat-ui/tpls/daily-interval.html'));
beforeEach(angular.mock.inject(function($rootScope, $compile) {
scope = $rootScope;
elm = angular.element('<load-directive type="directive" sub-type="interval" data="schedulerData"></load-directive>');
compile = $compile;
compile(elm)(scope);
scope.schedulerData = {
interval: 1,
}
scope.$digest();
}));
it("should be able to load daily directive", function() {
scope.directive = "daily";
var intervaldirective = elm.find('div[daily-interval-directive]');
expect(intervaldirective.length).toEqual(1);
});
});
which is not working fine for me. I tried to log the elm but it not loading the dailyInterevalDirective.
Aucun commentaire:
Enregistrer un commentaire