2017-02-15 20 views
8

Tôi rất mới với Angular 2. Tôi cần thiết lập các thẻ meta như og: description và tất cả từ một thành phần. Tôi không biết cách cập nhật động các thẻ meta, cũng thêm các thẻ mới vào index.html từ một thành phần cụ thể.Góc 2: Cách thêm và cập nhật thẻ meta động từ một thành phần (như dịch vụ tiêu đề)

Vui lòng trợ giúp.

PS: Tôi đã đọc về dịch vụ tiêu đề, nhưng đó chỉ là để cập nhật tiêu đề.

+0

http://stackoverflow.com/questions/16119398/how-can-i-update-meta-tags-in-angularjs – soorapadman

+0

Câu hỏi của tôi chỉ liên quan đến góc 2. Tôi muốn có một số ý tưởng về cách điều này có thể được thực hiện trong góc 2. –

+0

Xin lỗi, lỗi của tôi, tôi nên sử dụng http://stackoverflow.com/questions/40536237/angular2-set-meta-title-and-description/42245535 # 42245535 –

Trả lời

4

Trong Angular4-beta.0 một dịch vụ Meta đã được bổ sung cho phép bạn thêm/gỡ bỏ các thẻ meta

import { Meta } from '@angular/platform-browser'; 

constructor(private meta:Meta) { 
    meta.addTab(...) 
} 

Để biết thêm chi tiết, xem

+0

Tôi có thể đặt các thẻ trong index.html với dịch vụ Meta, nhưng khi tôi chia sẻ url trong facebook hoặc phương tiện truyền thông xã hội, nó không hiển thị các thẻ meta. Nếu tôi trực tiếp đặt các thẻ meta trong index.html các thẻ hiển thị của nó. vậy làm thế nào tôi có thể hiển thị các thẻ động trong phương tiện truyền thông xã hội? –

+0

Có lẽ chỉ bằng cách thêm chúng tĩnh. Tôi không biết làm thế nào và khi nào Facebook đọc các thẻ, nhưng có vẻ như trước khi Angular thêm chúng. –

+0

cảm ơn bạn đã trả lời. Tôi nghe nói về dựng hình phía máy chủ, dự án của tôi đang sử dụng góc với API nghỉ xuân. Vậy có cách nào để sử dụng nó cho các thẻ meta không? –

6

Đầu tiên dịch vụ Meta nhập khẩu trong thành phần của bạn

import { Meta } from '@angular/platform-browser'; 

Đặt nó trong constructor

constructor(private Meta:Meta){} 

Sử dụng dịch vụ:

this.Meta.addTag({ name: 'yourmetaname', content: 'yourmetacontent' }); 

bạn có thể tìm thêm thông tin trong DOCS oficial:

https://angular.io/docs/ts/latest/api/platform-browser/index/Meta-class.html

Các vấn đề liên quan