Question

我有一个名为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>

标题组件模板

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

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

Answer 1

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

您可能遇到的问题是，在标题组件中有2个绑定，并且ngIf中的i未定义或未绑定到for循环。我会明确命令，看看这是否有帮助。

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

你也有一个错误，你的h3标签是用h1关闭的，所以实际上角度甚至不应该编译它并在控制台中抱怨它。

Answer 2

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

Angular 2：更新服务变量和视图

2 个答案: