I am currently in the process of creating a custom directive that involves a simple template consisting of an input type textarea. I am assigning the ng-model to ngmodel and creating a link function where I am trying to capture the value of ngmodel. However, I am encountering an issue where it is printing as undefined. Could someone please assist me in resolving this issue? Attached is the link to the code that I have attempted to make corrections on: plunkr , and the code snippet starts here:
// Code starts here
var app = angular.module('myApp',[]);
app.directive('markdownEditor', function () {
return {
restrict: 'E',
scope: {
ngModel: "="
},
require:'ngModel',
template:
'<textarea ng-model="ngModel"></textarea>' +
'{{ ngModel}}',
link:function(scope,ele,attr,ctrl){
ele.on("keydown",function(){
alert(scope.ctrl)
})
}
}
});
app.controller('DemoCtrl', function ($scope) {
var x= $scope.markdown;
});<html ng-app="myApp">
<body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<div ng-controller="DemoCtrl">
<h3>Markdown editor</h3>
<markdown-editor ng-model="markdown" name="markdown"></markdown-editor>
</div>
</body>
</html>