标签: angular2-observables

如何对以下数组进行分区，使其在 30 岁以下和 30 岁及以上的数组之间进行分区。

我认为下面的代码可以做到，但它似乎只返回数组，而不是每个元素：

let ageArr = [
    { name: 'Ken', age: 28 },
    { name: 'Mary', age: 70 },
    { name: 'Kate', age: 12 },
    { name: 'David', age: 37 },
    { name: 'Laura', age: 42 },
    { name: 'Ian', age: 19 },
    { name: 'Peter', age: 21 },
    { name: 'Isobel', age: 55 },
    { name: 'Rebecca', age: 15 }
];

let [under, over] = Oversable.of(ageArr).partition(person => person.age < 30);

under.subscribe(a => console.log(a)); // [ { …

我正在尝试在使用 Resolve 加载组件之前调用 3 个不同的 API。

下面的这段代码写在解析函数中，并返回一个包含所有响应打包的对象。

现在当组件加载时，在我收到来自服务器的响应之前......它为返回的对象中的每个键返回 null。

请帮助我如何解决这个问题。在未从 API 收到响应之前，如何阻止它返回。

resolve() {
  this._apiFactory.getA().subscribe(response => {
     responseA = response;
  });
  this._apiFactory.getB().subscribe( response => {
     responseB = response;
  });
  this._apiFactory.getC().subscribe( response => {
     responseC = response;
  });

  return {
    'A': responseA ,
    'B': responseb ,
    'C': responseC 
  };
}

在我的组件中，我将一组需要执行的操作组合在一起。它们执行的顺序并不重要，但如果成功，我想在最后显示。每个操作都会导致调用 WebAPI。（我不明白，这将是很多更好，如果操作都是在一个呼叫传递然而，这是不是一种选择。

不幸的是，调用的次数太多了，它有效地对 API 进行了 DOS 处理。我试图延迟管道，但也许我没有把它放在正确的地方

const results: any[] = [];
this.bigArray.forEach(item =>
  results.push(
    this.aServiceWhichWillCallAPostMethod.doAnUpdate(item)
  )
);

forkJoin(results).subscribe(
  data => {
    Console.log('Yeah');
  },
  error => {
    Console.log('Oops');
  },
  () => {
  }
);

我试过在这里添加延迟

this.aServiceWhichWillCallAPostMethod.doAnUpdate(item).pipe(delay(5000))

和这里

forkJoin(results).subscribe

但没有运气

我是 Angular 的新手，正在编写这段代码。

  onUpdate(relation: RelationTypes) {
    let userId: number;
    this.assigneeId$.subscribe(assigneeId => userId = assigneeId);

    let customerId: string;
    this.customer$.subscribe(customer => customerId = customer.email);

    this.store.dispatch(actions.changeUserRelation({
      payload: {
        'userId': userId,
        'customerId': customerId,
        'relation': relation
      }
    }));
  }

和customerId$是assigneeId$可观察量。我知道这里可能存在竞争条件，我很想消除这种情况。

所以我在想这样的事情。

     this.subscription.add(this.assigneeId$.subscribe(assigneeId => {
       this.customer$.subscribe(customer => {
         this.store.dispatch(actions.changeUserRelation({
           payload: {
             'userId': assigneeId,
             'customerId': customer.email,
             'relation': relation
           }
         }));
       });
     }));

但这不起作用。也许你可以帮助我理解并解决问题。提前致谢。

正如标题所解释的那样,当router对象在subscribe成员内部被调用时,该对象变得不确定.

我来告诉你一些代码:

export class AuthComponent implements OnInit {
   password = '';
   email = ''; 

  constructor(
      private _router: Router,
      private authService: AuthService
  ) { }


  sendLogin(): void {
       this.authService.login(this.email, this.password)
                   .subscribe(function(token){
                     console.log("Success Response" + token)
                     this.token = token
                     // TOKEN Here is good
                     // now I want to change my page, but
                     // _router -> undefined
                     this._router.navigate(['/dashboard']);

                   },
                     error =>  console.log(error));
     }

sendLogin()提交表单时调用该方法.表格中的每个变量都很好.

这个过程subscribe完美,但后来 this._router.navigate(['/dashboard']); 给了我:

EXCEPTION:无法读取undefined的属性'navigate'

有任何想法吗 ？

我试着绑定键上事件和可观察对象,每次按下文本框字段中的一个键,我想在控制台中记录"你已按下:"+键字符串,没有显示任何错误,但按键时也没有任何反应. .

 /// <reference path="../../../typings/tsd.d.ts" />
import { Component } from '@angular/core';
import {Observable} from 'rxjs/Rx';
@Component({
    moduleId:module.id,
    selector: 'search-samp',
    template: '<input id="search" type="text" class="form-control" placeholder="search">'
})
export class SearchComponent {
    constructor(){
         var keyups = Observable.fromEvent($("#search"), "keyup").map(e=> {e.target.value});
         keyups.subscribe(data => { 
             debugger
             console.log("you have pressed:"+data)});
    }
 }

为什么不工作？

编辑:

 var keyups = Observable.fromEvent($("#search"), "keyup").map(function(e){debugger});

无法到达地图函数内的调试器点.看起来事件从未正确绑定..但为什么？

我正在执行注册操作，并且在后端中，当用户成功注册时，我返回他的ID，例如“ 105”，而当注册失败（用户已经存在）时，我返回“ USER_EXISTS”。我检查了邮递员的要求，回复的内容正确。
在两种情况下，我都返回“纯文本/文本”。

但是，我无法找到如何通过返回的Observable对象获取响应的正文。

在register.component.ts中：

userExists = "";
onSubmit() {

    const newUser : RegisterUser = {  email: this.register.email,
                                  password: this.register.password,
                                  firstName: this.register.firstName,
                                  lastName: this.register.lastName,
                                  phoneNumber: this.register.phoneNumber}


    this.registerService.addUser(newUser)
    .subscribe(response => (this.userExists = response)); //The purpose of this line is to get the body of the text/plain response and assign it into the this.userExists string
}

在RegisterService.service.ts中

addUser (registerUser) {

    return this.http.post(this.apiRoot + "User/add", registerUser, httpOptions);
}

我仍在学习有角度的东西，我想提供一个具有布尔可观察值的服务，并订阅该可观察值。

我遵循了本教程，因为我真正想要的是在用户未登录时隐藏菜单导航链接，并且本教程几乎相同。

因此，在我的登录服务中：

export class LoginService {

  private loggedIn = new BehaviorSubject<boolean>(false);

  get isLoggedIn() {
    console.log(this.loggedIn);
    return this.loggedIn.asObservable();
  }

  constructor(
    public http: Http,
    public utilsService: UtilsService) { }

  public login(credentials: Credentials): Observable<Response> {
    // login code
    // if user succeed login then:
    this.loggedIn.next(true);
  }

  public logout(): Observable<Response> {
    // logout code
    // if user succeed logout then:
    this.loggedIn.next(false);
  }
}

在我的组件中，我使用此功能

public isLoggedIn: boolean;

userIsLoggedIn() {

  this._login.isLoggedIn().subscribe(
    ((res: boolean) => {
        console.log(res);
        this.isLoggedIn = res;
    })
  );

} …

我正在尝试HttpClient在Angular 7中使用JSON .代码工作正常,但我正在尝试实现注释代码并停止使用CONST IMAGES并直接从api获取此数据,我还不能这样做.

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable()
export class ImageService {

  // public _url: string = "https://jsonplaceholder.typicode.com/photos";
  constructor(
    // public http: HttpClient
  ) {}

  theImages = [];
  // IMAGES = [];
  getImages(){
    // this.IMAGES = this.http.get(this._url);
   return this.theImages = IMAGES.slice(0);
 }
  getImage(id: number){
    // this.IMAGES = this.http.get(this._url);
    return IMAGES.slice(0).find(image => image.id == id);
  }

}
const IMAGES = [
  {
    "albumId": 1,
    "id": 1,
    "title": "accusamus …