元标记 angular 7

Question

我想在像 whatsapp telegram 这样的 Messenger 中分享 link，我添加到我的 angular 元标记中，但是当我将 link 放入 Messenger 时，它并没有像我预期的那样工作。这是我的代码：

constructor(
    private titleService: Title,
    private meta: Meta,
    private service: DataService,
    private route: ActivatedRoute,
    ) {
    this.meta.addTags([
        {name: 'Search', content: 'Ho.com'},
        { property: 'og:image', content: 'http://ho.com/assets/img/header/nav-logo-default.jpg' }
      ], true); 
    this.showLoader=true;
console.log("meta TagS")
        console.log("Id: "+this.route.snapshot.paramMap.get('id'));
        var id= this.route.snapshot.paramMap.get('id');

        this.service.getDetails(+id).subscribe(
              data => {
                  console.log("detail:"+data);

                    this.home_data = data;
           console.log("home_Data:"+this.home_data);
        this.home_price =
            '$' +
            this.home_data.ownerPrice.toLocaleString(undefined, {
                minimumFractionDigits: 0,
                maximumFractionDigits: 2,
            })
        this.owner_phone = this.home_data.phone.replace(
            /(\d\d\d\d\d)(\d\d\d)(\d\d)(\d\d)/,
            '() --'
        )
        this.meta.addTags([
            {name: 'Title', content: this.home_data.Title},
            {name: 'description', content: this.home_data.description},
            {name: 'Price', content: this.home_data.ownerPrice},
            {name: 'Search', content: 'Ho.com'},
           {property:'og:image',content:this.home_data.buildingPhotos[0] }
          ], true); 
                this.showLoader=false; },
              error => {;}
            ); }}

我希望我的 link 在像 Instagram 这样的 Messenger 中显示 link

Answer 1

解决方案是服务器端呈现 (SSR) Angular。

元标记 angular 7

Meta tags angular 7

meta-tags

angular

angular7