使用Angular2中标记的

我正在尝试用Angular2制作一个简单的Markdown内联编辑器.我尝试了几种方法,但似乎都没有效果.我安装了npm标记,现在可以在项目node_modules目录中看到它.
我可以导入它,它被netbeans识别.现在,当我使用它没有任何作用,如果我打开firefox debuger然后我发现
localhost：3000 /标记未找到.

我把降价转换器放在一个服务中.看起来如下：

import { Injectable } from 'angular2/core';

import * as marked from 'marked';

interface IMarkdownConfig {
  sanitize?: boolean,gfm?: boolean,breaks?: boolean,smartypants?: boolean
}

@Injectable()
export class MarkdownService {
  //private md: MarkedStatic;

  constructor() {
    //this.md = marked.setoptions({});
  }

  setConfig(config: IMarkdownConfig) {
   // this.md = marked.setoptions(config);
  }

  convert(markdown: string): string {
    if(!markdown) {
      return '';
    }
    return markdown;
    //return this.md.parse(markdown);
  }
}

像这样使用一切正常,除了降价没有翻译.如果我用md取消注释所有行,它就会停止工作.我正在使用它的组件看起来像这样：

import {Component,Input,OnInit } from 'angular2/core';
import {RouteParams} from 'angular2/router';

import {MarkdownService}  from '../services/markdown-converter' 


@Component({
  selector: 'my-story',templateUrl: 'app/components/story.html',bindings: [MarkdownService]
})
export class StoryComponent implements OnInit {
    public html: string;
    private md: MarkdownService;

    constructor(
         private _routeParams: RouteParams,private _converter: MarkdownService) {
         this.html ='';
         this.md = _converter;
    }

    ngOnInit() {
    }

    public updateValue(val:string) {
        if(!val) { return ''; }
        this.html = val;
    }
}

我没有显示所有涉及的文件但是如果有文件我应该在评论中提出.如果这是我对Typescript和/或Angular2注入无法正确的事情,那么任何解释这些概念的信息资源都是受欢迎的.我已经在www上阅读了很多内容,但似乎所有关于Angular2的文档都已经过时了.

解决方法

我会这样导入标记的库：

import marked from 'marked';

并像你一样使用它：

@Component({
  selector: 'markdown',template: `
    <div [innerHTML]="convertedData">
    </div>
  `
})
export class MarkdownComponent {
  @Input('data')
  data:string;

  ngOnChanges() { 
    var md = marked.setoptions({});
    this.convertedData = md.parse(this.data);
  }
}

看到这个plunkr：https://plnkr.co/edit/zUstS3T7IJxjQUVCXiAM?p=preview.

这个问题也可以帮到你：

> How to detect async change to ng-content