小编Joh*_*nes的帖子

Typescript Angular - Observable:如何改变它的价值？

也许我错过了什么.我找不到Observable及其语法的简单教程.我正在使用Angular,我需要从服务中调用一个函数(在一个组件中定义).我读了这个解决方案.但我无法弄清楚如何更改服务中创建的Observable中的值(可能创建不是最好的方法).

我有一个像解决方案中的组件:

@Component({
  selector: 'my-component',
  ...
)}
export class MyComponent {
   constructor(myService:MyService) {
   myService.condition.subscribe(value => doSomething(value));
}

doSomething(value) {
  if (value) // do stuff
  else // other stuff
}

Run Code Online (Sandbox Code Playgroud)

}

这是我的服务:

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

@Injectable()

export class MyService {
    private condition: Observable<boolean>;
    constructor() { 
       this.condition= new Observable(ob => {ob.next(false); })
       // maybe ob.next is not the best solution to assign the value?
    }

    change() {// how can i change the …

Run Code Online (Sandbox Code Playgroud)

observable typescript angular

Joh*_*nes

2017 05-23

31
推荐指数

2
解决办法

6万
查看次数

Ionic 2 Angular 2 JSON - 无法读取未定义的属性'x',但x.field可以正常工作

在Ionic2项目中,我有一个页面'A',它调用提供JSON文件结果的服务.在'A'页面中,我能够读取每个JSON元素的所有字段,并在HTML中显示它们.比,我需要在另一个页面'B'中显示一些这样的字段,所以用这个元素之一(参数)推送这个页面.在页面'B'中,我无法从HTML中读取元素direclty的字段.唯一有效的方法是分别读取每个字段.我给你举个例子:

test.json:

{
"elements" : [
    {   "name":"Max",
        "age":"23"},
    {   "name":"John",
        "age":"31"}
]}

Run Code Online (Sandbox Code Playgroud)

提供者GET调用:

getElements(){
      return this.http.get('test.json').map(res => res.json());
}

Run Code Online (Sandbox Code Playgroud)

第一页getjson:

public myelements: any;
loadElements(){
      this.getjson.getElements().subscribe(
          result => {
              this.myelements=result.elements; 
          }
      );
  }

Run Code Online (Sandbox Code Playgroud)

在页面A这适当地工作:

<div class="row" *ngFor="let ele of myelements" (click)="goToPageB(ele)">
{{ele.name}} and {{ele.age}}</div>

Run Code Online (Sandbox Code Playgroud)

这个(点击)功能是:

goToPageB(ele) {
      this.navCtrl.push(PageB, 
                        {ele: ele}
      )
  }

Run Code Online (Sandbox Code Playgroud)

在页面B中,一种方式不起作用,另一种方式起作用.我不明白为什么:

public myele: any; // the best way, not work
public myname: any; // the other way, works

ionViewDidLoad() { 
    this.myele = this.navParams.get('ele'); // the best way, but …

Run Code Online (Sandbox Code Playgroud)

json angular

Joh*_*nes

lucky-day

2
推荐指数

1
解决办法

1411
查看次数

web组件(香草,没有聚合物):如何加载<template>内容？

我是网络组件的新手.我检查了一些例子,但我真的无法弄清楚如何加载(插入DOM)一个单独的Web组件的内容.从这个例子开始,我把这段代码放在一个名为my-element.html的文件中:

<template id="my-element">
  <p>Yes, it works!</p>
</template>
<script>
    document.registerElement('my-element', class extends HTMLElement {
      constructor() {
      super(); 
      let shadowRoot = this.attachShadow({mode: 'open'});
      const t = document.querySelector('#my-element');
      const instance = t.content.cloneNode(true);
      shadowRoot.appendChild(instance);
    }
});
</script>

Run Code Online (Sandbox Code Playgroud)

这是我的index.html:

<!doctype html> 
<html>
 <head>
   <meta charset="utf-8">
   <title>my titile</title>
   <link rel="import" href="my-element.html">
</head>
<body>
  Does it work?
  <my-element></my-element>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

我在使用最新的Chrome 56,所以我不需要填充.我运行polyserve,只有"它有效吗？" 出现.我尝试(像原始示例)"customElements.define"语法而不是"document.registerElement",但不起作用.你有什么想法吗？如果我不想使用影子dom,我还能改变什么？

谢谢

javascript web-component html5-template custom-element html-imports

Joh*_*nes

2017 02-07

1
推荐指数

1
解决办法

598
查看次数