1
我在Angular 4.x应用程序中使用angular2-markdown。angular2-markdown与异步操作失败
我有分量:
<div class="content" mat-padding>
<md-card class="mat-elevation-z2" mat-whiteframe="8">
<div class="cover-wrapper">
<img md-card-image src="{{ article?.cover }}">
</div>
<md-card-title fxFlex="100%">
<span>{{ article.title }}</span>
</md-card-title>
<md-card-content>
<markdown [data]="article.text"></markdown>
</md-card-content>
</md-card>
</div>
的组件是设置为以下几点:
import { Component, Input, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Article } from '../../models/article';
import { ArticleStore } from '../../state/ArticleStore';
import { InterModuleService } from '../../service/inter-module.service';
@Component({
selector: 'app-article-detail',
templateUrl: './article-detail.component.html',
styleUrls: ['./article-detail.component.css']
})
export class ArticleDetailComponent implements OnInit {
private article: Article;
constructor(private route: ActivatedRoute,
private articleStore: ArticleStore,
private interModuleService: InterModuleService) { }
ngOnInit(): void {
this.interModuleService.article
.subscribe((data) => {
this.article = data;
Promise.all(Object.keys(this.article['attachments']).map((at) => {
return this.articleStore.getAttachment(this.article['id'],at).then ((res) => {
this.article.attachments[at]['data'] = res.toString();
})
})).then(()=> {
this.interModuleService.sidenavToc.nativeElement['innerHTML'] = this.article.attachments['toc'].data;
});
});
this.route.data
.subscribe((data: { article: Article }) => {
this.interModuleService.article.next(data.article);
this.interModuleService.article.complete();
});
}
}
根据对angular2,降价的文档,我有几个选项用于过滤降价到HTML:
<div Markdown>
### your markdown code
</div>
<!-- or use angular component -->
<markdown>
### your markdown code
</markdown>
<!-- to load from remote URL -->
<div Markdown path="/path/to/readme.md"></div>
<!-- load remote source code with auto syntax highlighting -->
<markdown path="/path/to/code.cpp"></markdown>
<markdown path="/path/to/code.java"></markdown>
<!-- load remote source code from url stored in variable
(see additional details about variable binding in the next section) -->
<markdown [path]="urlVariable"></markdown>
但是,没有一项工作。通常,article.text
始终为空/未定义。
不过,如果我是做<div Markdown [innerHTML]='article.text'></div>
我会得到来自VAR的文本,但它是一个带引号的字符串angular2-降价忽略。下面的截图。
全部项目 - >https://github.com/flamusdiu/micro-blog
'<降价[数据] = “文章的.text?”>'? – Alex
我得到:错误错误:未捕获(承诺):TypeError:无法读取未定义的属性'替换'。 =( – flamusdiu
你从哪里得到这个'replace'?你通过'article.text',但是使用'replace'? – Alex