Question

关于在Angular 2中创建动态模板的教程：How can I use/create dynamic template to compile dynamic Component with Angular 2.0?

我设法创建动态组件，但是当我尝试在模板中添加管道（exponentialStrength）时，它会破坏以下错误：

Uncaught Error: Template parse errors:
The pipe 'exponentialStrength' could not be found

我还尝试在作者plunker代码预览中添加几个管道，但它显示相同的错误。

创建动态模板时是否有实现管道的方法？

这是我的html模板：

  <div  [style]="ContentCss | safeCss">
    <input type="text" class="form-control" [disabled]="Disabled" [(ngModel)]="Entity[FieldName]" >
  </div>

和组件：

import { Component, Input } from '@angular/core';
import { Observable } from "rxjs/Rx";
import { SafeHtml, SafeCss } from '../Components/sanitizeHtml.component'

@Component({
    selector: 'textbox',
    templateUrl: './textbox.component.html',
})
export class Textbox {

    @Input() public Entity: any;
    @Input() public Disabled: boolean;


}

管道（即使使用angular2默认管道也会显示错误）：

import { Pipe, PipeTransform } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';

@Pipe({ name: 'safeHtml' })
export class SafeHtml implements PipeTransform {
    constructor(private sanitizer: DomSanitizer) { }

    transform(html) {
        return this.sanitizer.bypassSecurityTrustHtml(html); 
    }
}

@Pipe({ name: 'safeCss', pure:false })
export class SafeCss implements PipeTransform {
    constructor(private sanitizer: DomSanitizer) { }

    transform(style) {
        return this.sanitizer.bypassSecurityTrustStyle(style);
    }
}

用管道创建动态模板？

0 个答案: