使用双向绑定和angular2-markdown模块

时间:2017-10-26 21:03:00

标签: angular web markdown

我有一个使用angular-2降价的应用。无论textarea中的用户类型是否具有正确的markdown格式,页面都应在下面的运行时显示预览。就像在stackoverflow中编写问题一样。这是我在html中的表单:

TextBox

这是我的组成部分:

<div class="row align-row">
  <div class="col-md-6">

   <form #f="ngForm" (ngSubmit)="save(f.value)">

  <div class="form-group">
    <textarea class="form-control" id="post" rows="15" placeholder="Enter your post" [(ngModel)]="post.post" name="post" required></textarea>
  </div>

  <button type="submit" class="btn btn-primary">Submit</button>
</form>
  </div>
     <div class="col-md-6">
       <p>Preview</p>
    <markdown>
    {{ post.post }}
  </markdown>

 </div>
</div>

我已成功实施并安装了markdown模块。问题是,没有预览。我看到没有import { Component, OnInit } from '@angular/core'; import { PostService } from './../../services/post.service'; import { CategoryService } from './../../services/category.service'; @Component({ selector: 'app-create-post', templateUrl: './create-post.component.html', styleUrls: ['./create-post.component.css'] }) export class CreatePostComponent implements OnInit { categories$; post = {}; constructor(categoryService: CategoryService, private postService: PostService) { this.categories$ = categoryService.getCategories(); } save(post){ this.postService.create(post); } ngOnInit() { } } 的预览但没有看到。

1 个答案:

答案 0 :(得分:0)

service<markdown [data]="marked"></markdown>解决了问题