html部分
<div id="foridis{{idx}}" *ngFor="let item of data;let idx=index">
<div>
<a [href]="item.href" [title]="item.id">{{ item.title}}</a><br />
<a [href]="item['href-s']">{{ item.title}}-s</a>
<div [innerHTML]="item.Content">
</div>
</div>
</div>
ts部分
data = [
{
"id": 1,
"href": "http://www.golgle.com.tw",
"title": "Google",
"Content": "<p>Google是總部位於美國加州山景城的跨國科技公司,為Alphabet的子公司,業務範圍涵蓋網際網路廣告、網際網路搜尋、雲端運算等領域,開發並提供大量基於網際網路的產品與服務,其主要利潤來自Ads等廣告服</p>",
"href-s": "https://www.google.com.tw"
},
{
"id": 2,
"href": "http://tw.yahoo.com",
"title": "雅虎",
"Content": "<p>Yahoo奇摩是台灣入口網站之一,由「香港商雅虎資訊股份有限公司台灣分公司」代表營運。該網站於2001年10月雅虎台灣與奇摩站合併後成立,網址續用雅虎台灣的「tw.yahoo.com」</p>",
"href-s": "https://tw.yahoo.com",
},
{
"id": 3,
"href": "http://www.microsoft.com/zh-tw",
"title": "微軟",
"Content": "<p>微軟是美國的一家跨國電腦科技公司,公司於1975年由比爾·蓋茲與保羅·艾倫創立,以研發、製造、授權及提供廣泛的電腦軟體服務為主。坐標為47.642229°N 122.136934°W</p>",
"href-s": "https://www.microsoft.com/zh-tw",
}
];
參考資料
1.保哥的
Angular 開發實戰:從零開始
2.
Angular官網