我在角度上真的很新。
即时通讯使用的是angular 1.6，我需要在现有应用程序上进行一些更改。
正如我可以搜索到的那样，以前的开发人员正在使用http://www.codingdrama.com/bootstrap-markdown/来创建带有一些文本选项和预览的textarea。现在，我的任务是重写预览按钮，以使用插入的文本来调用我们的API，并且API返回一些结果。在该降价文档中，我加起来发现了这一点。
onPreview：函数（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
}，
所以我开始重写：
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;
},
});
}
}
}]);
我找不到错误，但是previewContent始终返回“ preview”。从API角度来看还可以，并且
response.data.content也是正确的。不知道下一步该怎么做
最佳答案
挑战在于您要执行一个异步函数并想返回它的值。在您的代码示例中，您已经从onPreview函数返回，而async函数仍在后台执行。在AngularJS中，您可以使用promises解决此类问题：“一种服务，可以帮助您异步运行函数，并在处理完成后使用它们的返回值（或异常）”。
但是：据我从source可以看到，降价组件不支持诺言。 onPreview方法期望返回一个字符串。唯一的选择是在onPreview内部等待，直到AJAX请求返回-强烈建议不要这样做。因此，恕我直言，不可能在onPreview内使用AJAX请求。
如果bootstrap-markdown支持诺言，您可以尝试以下操作：
app.directive("markdowntextarea", ['$http', '$q', function ($http, $q) { // inject $q
...
onPreview: function (e) {
console.log('im here!!');
var deferred = $q.defer();
if (e.isDirty()) {
var originalContent = e.getContent();
$http({
url: '/api/markdown/',
data: {"body": originalContent, "code": "a"},
method: 'POST'
}).then(function successCallback(response) {
console.log("successCallback", response.data.content);
deferred.resolve(response.data.content);
}, function errorCallback(response) {
console.log("errorCallback");
deferred.reject("error");
});
} else {
// quando esta vazio
deferred.resolve("");
}
return deferred.promise;
},
...
这是一个演示该概念的JSFiddle。这是Dave Kerr的AngularJS Promises - The Definitive Guide Part 2 - JSFiddle对AngularJS 1.6的更新。