I am fairly new to working with Angular. Currently, I am using Angular 1.6 and I have been tasked with making some modifications to an existing application.
After doing some research, I discovered that the previous developer had used in order to create a textarea with text options and a preview feature. Now, my job is to override the preview button so that it calls our API with the inserted text and receives a result in return. In the documentation of the markdown tool I found, I came across the following code:
onPreview: function(e) { var previewContent
if (e.isDirty()) {
var originalContent = e.getContent()
previewContent = "Prepended text here..."
+ "\n"
+ originalContent
+ "\n"
+"Apended text here..."
} else {
previewContent = "Default content"
}
return previewContent
},
Thus, I began the process of overriding it:
app.directive("markdowntextarea", ['$http', function ($http) {
return {
link: function (el_scope, element, attr) {
var previewContent = "preview";
element.markdown(
{
autofocus: false,
savable: false,
onPreview: function (e) {
console.log('1');
if (e.isDirty()) {
console.log('2!!')
var originalContent = e.getContent();
$http({
url: '/api/markdown/',
data: {"body": originalContent, "actual_format": "md", "desire_format": "html"},
method: 'POST'
}).then(function successCallback(response) {
console.log(response.data.content);
previewContent = response.data.content;
});
}else{
console.log('3')
previewContent = "";
}
previewContent = 'test';
return previewContent;
},
});
}
}
}]);
Despite my efforts, I am unable to identify the error I made. The previewContent variable always returns "preview". The API seems to be working fine and the response.data.content is correct as well.
At this point, I am unsure of what steps to take next.