Javascript 获取特定索引处可观察的数组元素[html]

如何使用html从包含数组的可观察对象中获取单个值。我正在运行Angular2 w/Typescript

打字稿

private observable = Observable.of([1,2,3,4,5])

html

{{observable[2]}

---

i、 e获取由可观察对象持有的索引2中的数组元素

您需要订阅可观察对象，然后通过索引访问值：

@Component({
  template: `Value: {{ observableValue[2] }}`
})
export class SampleComponent implements OnInit {

  values = Observable.of([1, 2, 3, 4, 5]);
  observableValue: number[];

  ngOnInit(): void {
     this.values.subscribe(value => this.observableValue = value);
  }

}

---

您需要订阅observable，然后通过索引访问值：

@Component({
  template: `Value: {{ observableValue[2] }}`
})
export class SampleComponent implements OnInit {

  values = Observable.of([1, 2, 3, 4, 5]);
  observableValue: number[];

  ngOnInit(): void {
     this.values.subscribe(value => this.observableValue = value);
  }

}

---

如果不订阅一个可观察对象，你就无法获得价值

private observable = Observable.of([1,2,3,4,5])

也可以在html中使用异步管道直接

<p>{{observable | async}}</p>

{{可观察|异步}

如果不订阅可观察的，则无法获取值

private observable = Observable.of([1,2,3,4,5])

也可以在html中使用异步管道直接

<p>{{observable | async}}</p>

{{可观察|异步}

根据前面的答案。你应该避免两件事（如果可能的话）：

手动

.subscribe（）

。改用异步管道，这样它将为您管理订阅

内部状态，如

.subscribe（val=>this.val=val）

。直接使用流并添加

Subject

（行为、异步等），这样完整的逻辑将在流中关闭

您的问题的解决方案是创建一个流，该流结合了当前索引、阵列的可观察性和索引处的发射元素

public index$ = new BehaviorSubject(2)
public observable$ = Observable.of([1,2,3,4,5])

public elementAtIndex$ = Observable.combineLatest(
  this.index$,
  this.observable$,
  (index, arr) => arr[index]
)

那么在你看来,

<p>{{ elementAtIndex$ | async }}</p>

---

根据先前的回答。你应该避免两件事（如果可能的话）：

手动

.subscribe（）

。改用异步管道，这样它将为您管理订阅

内部状态，如

.subscribe（val=>this.val=val）

。直接使用流并添加

Subject

（行为、异步等），这样完整的逻辑将在流中关闭

您的问题的解决方案是创建一个流，该流结合了当前索引、阵列的可观察性和索引处的发射元素

public index$ = new BehaviorSubject(2)
public observable$ = Observable.of([1,2,3,4,5])

public elementAtIndex$ = Observable.combineLatest(
  this.index$,
  this.observable$,
  (index, arr) => arr[index]
)

那么在你看来,

<p>{{ elementAtIndex$ | async }}</p>

---

我也面临着类似的问题。我可以订阅observable并获取值，但这不是最好的方式，因为现在你必须处理订阅和取消订阅、内存泄漏等等。使用可观察值的最佳方法是使用异步管道“|”）。 所以，这里是我提出的解决方案

yourComponent.ts

source: any = of([1, 2, 3, 4, 5]);

yourComponent.html

<div *ngFor = " let s of source | async; let i = index">
{{s}} {{source | async | slice :i:i+1}}
</div>

希望对你有帮助

---

在

上阅读有关角管的更多信息，我也面临类似的问题。我可以订阅observable并获取值，但这不是最好的方式，因为现在你必须处理订阅和取消订阅、内存泄漏等等。使用可观察值的最佳方法是使用异步管道“|”）。 所以，这里是我提出的解决方案

yourComponent.ts

source: any = of([1, 2, 3, 4, 5]);

yourComponent.html

<div *ngFor = " let s of source | async; let i = index">
{{s}} {{source | async | slice :i:i+1}}
</div>

希望对你有帮助

---

在

上阅读更多关于角管的信息这正是我所需要的。谢谢。你们（索引，arr）是从哪里来的？I get

类型“{}”不能用作索引类型

Error

的最后一个参数。CombineTest

采用函数，该函数将获得作为参数的组合值。看看签名：如果你需要找到索引呢？这正是我需要的。谢谢。你们（索引，arr）是从哪里来的？I get

类型“{}”不能用作索引类型

Error

的最后一个参数。CombineTest

采用函数，该函数将获得作为参数的组合值。看看签名：如果你需要找到索引怎么办？