Question

我正在更新角度4.1.3

的过程中重新设计我们的角度服务之一

我们之前使用过BroweserDomAdapter，但是看到角色团队已经弃用了，我正在努力弄清楚重写之后的问题。

我做错了什么：

import { Injectable }        from '@angular/core';
import { Component, Inject } from '@angular/core';
import { DOCUMENT } from '@angular/platform-browser';
import { Title }             from '@angular/platform-browser';
import { BrowserDomAdapter } from '@angular/platform-browser/src/browser/browser_adapter';

@Injectable()
export class SeoService {
/**
 * Angular 2 Title Service
 */

/**
 * <head> Element of the HTML document
 */
private headElement: HTMLElement;
/**
 * <meta name="description"> Element of the document head
 */
private metaDescription: HTMLElement;
/**
 * <meta name="robots"> Element of the document head
 */
private robots: HTMLElement;
dom:any;
/**
 * Inject the Angular 2 Title Service
 * @param titleService
 */
constructor (@Inject(DOCUMENT) private titleService: Title){
    this.titleService = titleService;

    /**
     * get the <head> Element
     * @type {any}
     */
    this.dom = document;

    this.headElement = this.dom.getSelection('head');
    this.metaDescription = this.getOrCreateMetaElement('description');
    this.robots = this.getOrCreateMetaElement('robots');
}

public getTitle(): string {
    return this.titleService.getTitle();
}

public setTitle(newTitle: string) {
    this.titleService.setTitle(newTitle + ' | Stareable');
}

public getMetaDescription(): string {
    return this.metaDescription.getAttribute('content');
}

public setMetaDescription(description: string) {
    this.metaDescription.setAttribute('content', description);
}

public getMetaRobots(): string {
    return this.robots.getAttribute('content');
}

public setMetaRobots(robots: string) {
    this.robots.setAttribute('content', robots);
}

/**
 * get the HTML Element when it is in the markup, or create it.
 * @param name
 * @returns {HTMLElement}
 */
private getOrCreateMetaElement(name: string): HTMLElement {
    let el: HTMLElement;
    el = this.dom.getSelection('meta[name=' + name + ']');
    if (el === null) {
        el = this.dom.createElement('meta');
        el.setAttribute('name', name);
        this.headElement.appendChild(el);
    }
    return el;
  }
 }

以下是控制台中的错误：

错误错误：未捕获（在承诺中）：TypeError：this.titleService.setTitle不是函数 TypeError：this.titleService.setTitle不是函数在SeoService.setTitle

谢谢！

Answer 1

我不得不改变＆＃34; getSelection＆＃34;本机javascript函数的方法：

this.headElement = this.dom.getElementsByTagName("head")[0];

和

el = this.dom.querySelector("meta[name=\'"+ name + "\']");

之后一切都恢复了。

Answer 2

修复你的构造函数：

<div class="row">
                <asp:Repeater ID="rptStatuses" runat="server">
                    <ItemTemplate>
                        <div class="col-md-4 col-sm-4">
                            <div class="status noAction text-center">
                                <div class="banner">

                                    <asp:Label runat="server"> <%# Eval("ID") %></asp:Label>
                                </div>
                                <div class="label"><%# Eval("Name") %></div>
                            </div>
                        </div>
                    </ItemTemplate>
                </asp:Repeater>

在构造函数中声明私有参数对于整个组件是可见的。

角度中断，迁移到4.1.3

2 个答案: