Как получить доступ к частной собственности через компонент приложения в Angular 4?

Question

Я получаю текущий URL через код, который я объявил в компоненте приложения, на свой app.component.html

app.component.ts

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';
  public href: string = "";

  constructor(private router: Router) {}

  ngOnInit() {
  }

}

app.component.html

<div class="page-wrap {{router.url}}">

  <app-header></app-header>

  <div class="content-wrap">

    <app-sidebar></app-sidebar>

    <div class="app-content">
      <flash-messages></flash-messages>
      <router-outlet></router-outlet>
    </div>

  </div>

</div>

Когда я компилирую код выше через "ng serve -prod", мне предлагают:

ОШИБКА в C: / Users / theone / Documents / Node Projects SourceTree / сон-Угловая / ЦСИ / $$ _ гендир / приложение / app.component.ngfactory.ts (58,68): свойство 'router' является частным и доступно только внутри класса 'AppComponent'.

Answer 1

Сообщение об ошибке говорит вам, что именно не так. Поле является частным. К нему нельзя получить доступ из шаблона. Попробуйте

constructor(public router: Router) { }

Answer 2

Попробуйте использовать

ng build --env=prod 
Seems ng build --env=prod and ng build --prod are not same.

и это известная проблема с angular-cli, если вы используете старые версии. или вам нужно поменять его на публичный

constructor(public router: Router) { }

Вот упомянутая проблема: https://github.com/angular/angular-cli/issues/5621