AngularJS এর মাধ্যমে নিজের Directives তৈরি।
Md. Shahinoor Islamনিজের Directives তৈরি।
HTML উপাদান, মন্তব্য বা CSS classes দিয়ে Directives প্রদর্শন করতে পার। উদাহরনঃ
<my-directive></my-directive>
<input my-directive>
<!– directive: my-directive–>
<input>
একটি Directive এর ধারনা
angular.module(‘app’, []).directive(‘myDir’, function() {
return myDirectiveDefinition;
});
একটি Button Directive লেখা
escribe(‘button directive’, function () {
var $compile, $rootScope;
beforeEach(module(‘directives.button’));
beforeEach(inject(function(_$compile_, _$rootScope_) {
$compile = _$compile_;
$rootScope = _$rootScope_;
}));
it(‘adds a “btn” class to the button element’, function() {
var element = $compile(‘<button></button>’)($rootScope);
expect(element.hasClass(‘btn’)).toBe(true);
});
});
});
button directive ব্যবহার
<button type=”submit”
>Click Me!</button>
একটি Custom Validation Directives প্রবর্তন
একটি Custom Validation directive প্রবর্তন
এই জায়গায় আমাদের একটা test আছে, সুতরাং আমরা directive এর কার্যকারিতা বাস্তবায়ন করতে পারিঃ
myModule.directive(‘validateEquals’, function() {
return {
require: ‘ngModel’,
link: function(scope, elm, attrs, ngModelCtrl) {
function validateEqual(myValue) {
var valid= (myValue === scope.$eval(attrs.validateEquals));
ngModelCtrl.$setValidity(‘equal’, valid);
return valid ? myValue : undefined;
}
ngModelCtrl.$parsers.push(validateEqual);
ngModelCtrl.$formatters.push(validateEqual);
scope.$watch(attrs.validateEquals, function() {
ngModelCtrl.$setViewValue(ngModelCtrl.$viewValue);
});
}
};
});