Javascript 角度2：更新服务变量和视图

我有一个名为ValueService的服务，它的值为0。 然后我有一个导航组件和一个航向组件。valueService中的值不会在单击时更新标题视图。我是新的角度2的东西，所以我不知道如何让这个工作。这是我到目前为止所拥有的。谢谢你的帮助

价值服务

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Rx';

@Injectable()
export class ValueService {
value:number;

 constructor() {
   this.value = 0;
 }

  goTo(value){
   this.value = value;
   console.log('value in service', this.value);
  }   

<button *ngFor="let d of array | keys; let i = index" (click)="valueService.goTo(i)"> {{ i }} </button>

导航组件模板

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Rx';

@Injectable()
export class ValueService {
value:number;

 constructor() {
   this.value = 0;
 }

  goTo(value){
   this.value = value;
   console.log('value in service', this.value);
  }   

<button *ngFor="let d of array | keys; let i = index" (click)="valueService.goTo(i)"> {{ i }} </button>

{{i}

标题组件模板

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Rx';

@Injectable()
export class ValueService {
value:number;

 constructor() {
   this.value = 0;
 }

  goTo(value){
   this.value = value;
   console.log('value in service', this.value);
  }   

<button *ngFor="let d of array | keys; let i = index" (click)="valueService.goTo(i)"> {{ i }} </button>

问题就在这里。我只想显示由按钮索引从nav组件中选择的h3，但出于任何原因，它保持设置为默认值0，并且不更新该值

<h3 *ngIf="i==valueService.value" *ngFor="let d of array | keys; let i = index"> {{ text here }} </h1>

{{text here}

您的服务和导航组件看起来不错

您可能会遇到这样的问题：在heading组件中有2个绑定，ngIf中的i没有定义或没有绑定到for循环。我会明确下订单，看看这是否有帮助

<template ngFor let-d [ngForOf]="array" let-i="index">
    <h3 *ngIf="i==valueService.value">
        {{ text here }}
    </h3>
</template>

{{text here}}

---

您还有一个错误，即h3标记用h1关闭，因此实际上angular甚至不应该编译它并在控制台中对此进行投诉。

您的服务和导航组件看起来很好

您可能会遇到这样的问题：在heading组件中有2个绑定，ngIf中的i没有定义或没有绑定到for循环。我会明确下订单，看看这是否有帮助

<template ngFor let-d [ngForOf]="array" let-i="index">
    <h3 *ngIf="i==valueService.value">
        {{ text here }}
    </h3>
</template>

{{text here}}

---

您还有一个错误，h3标记用h1关闭，因此实际上angular甚至不应该编译它并在控制台中对此进行投诉。

我在json文件中设置了一个全局变量，并更新了该值。它还更新了我的兄弟组件中的值

我在json文件中设置了一个全局变量，并更新了该值。它还更新了我的兄弟组件中的值

嗯，我想对valueService的引用是可以的，否则您也会得到一个异常。您是否更改了该组件或其父组件的Changedetectionstrategy？没有。我没有这样做。我认为出于某种原因，它们的同级组件没有使用新值更新。嗯，我想对valueService的引用是可以的，否则您也会得到一个异常。您是否更改了该组件或其父组件的Changedetectionstrategy？没有。我没有这样做。我认为出于某种原因，它们的兄弟组件并没有使用新值进行更新。