对于用 Angular 2 编写的应用程序，我需要将包含在变量中的动态 html 包含到模板中。你可以在这里看到代码：

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  template: '{{name}}',
})
export class AppComponent  { name = '<h2>Angular</h2>'; }

然而，结果不是我想要的：

<h2>Angular</h2>

我想知道是否有一种技术可以包含此变量以将标签处理为 html。

Ps：我试试这个代码：

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  template: ' <div innerHTML="name" ></div>',
})

export class AppComponent  { name = '<h2>Angular</h2>'; }

但这并不是我真正想要的，因为我不希望 div（或其他标签）封装<h2>.

我只想知道如何render在Ionic应用程序上使用 html内容从相关类的属性中获取内容。

例如，我有以下两个文件...

家.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';

@Component({
    selector: 'page-home',
    templateUrl: 'home.html'
})
export class HomePage {

    message: String;

    constructor(public navCtrl: NavController) {
        this.message =
            `Below there is a piece of cake for you:<br />
            <img src="http://image.ibb.co/nJVNVS/cake.png" />`;
    }

}

主页.html

<ion-header>
    <ion-navbar>
        <ion-title>Home</ion-title>
    </ion-navbar>
</ion-header>

<ion-content padding>
    <h2>Welcome to Ionic!</h2>
    <p>
        This starter project comes with simple tabs-based layout for apps that are going to primarily …

我有一个功能女巫从文件中获取 html 内容作为字符串。之后我把它作为一个 html 对象。我可以在我的控制台中清楚地看到它可以工作。如何将它从服务传递到 div 元素？

导航.service.ts：

html: string;
      public  getZipFileContent(urlPath:string, pathInZip:string, ) {
        getFileContentFromRemoteZip(urlPath, pathInZip, (content) => {
          console.log(content);
          let html = content; 
          let htmlObject = document.createElement('div');
          htmlObject.innerHTML = html;
          console.log(htmlObject);
          this.html = html; // it's a string
          this.html = htmlObject // error : can't asign string as HTMLdivElement
        });
      }
    }

通过在我的组件中添加{{navSrv.html}}我现在得到了什么：

我想得到什么：

你好

Console.log 来自：console.log(htmlObject);

如何获取 htmlObject 并将其用作变量？

我有一个ionic2页面,我想在离子项内打印HTML:这是ionic2页面:

@Page({
    templateUrl: './html-page.html',
})
export class Demo{

    htmlString:string = "Hello<br/><br/>Html"

    constructor() {
    }
}

这是相应的模板:

<ion-content>
    <ion-card>
        {{htmlString}}
    </ion-card>
</ion-content>

而现在 Hello<br/><br/>Html是输出.但我想要那个

你好

HTML

将输出.

你如何为模态的内容正确添加换行符？我有一个简单的字符串:

'Please check the Apple and/or \nOrange Folder checkbox to start program.'

我把"\n"换行符放在"橙色"之前,所以我希望模态有两行.但是,当显示模态时,所有内容都显示在一行上('\n'未显示,因此我确信打字稿正确地看到它并且不使其成为字符串的一部分).