Question

我写了以下表格：

<form [formGroup]="newNewsForm" novalidate>
        <md-select placeholder="Thème" formControlName="tag">
          <md-option *ngFor="let sport of [{id:'running', name:'running'}, {id: 'golf', name:'golf'}]" [value]="sport.id">
            {{sport.name}}
          </md-option>
        </md-select>

        <md-input-container class="full-width">
          <input mdInput placeholder="Titre" formControlName="title">
        </md-input-container>

        <md-input-container class="full-width">
          <textarea mdInput placeholder="Contenu" formControlName="content"></textarea>
        </md-input-container>
      </form>

我想向用户显示实时预览，因此我写了以下内容：

<md-card class="full-width">

      <md-card-title>{{ newNewsForm?.value?.title }}</md-card-title>
      <md-card-subtitle *ngIf="newNewsForm?.value?.tag">#{{ newNewsForm?.value?.tag }}</md-card-subtitle>
      <md-card-content>
        <p>
           {{ newNewsForm?.value?.content }}
        </p>
      </md-card-content>

      <md-card-actions></md-card-actions>

    </md-card>

除了使用回车符之外，一切都很顺利。

如果我将以下内容写入textarea：第一行，第二行

在预览中显示一行：第一行，第二行。

我尝试使用[innerHtml]失败了。

有什么想法吗？

由于

Answer 1

试试这个：

$conn = new databaseClass()

Answer 2

尝试

@Component({
    selector: 'my-app',
    template: `
        <div>
          <textarea [(ngModel)]="val"></textarea>
          <p *ngFor="let subVal of vals">
            {{subVal}}
            <br/>
          </p>
        </div>
   `,
}) 
export class App {
    val: string = ""

    get vals(){
        return this.val.split("\n");
    }

    constructor() {}
}

角度字符串插值 - 渲染\ n

2 个答案: