Question

我是Angular的新手。我正在做的是在点击时从json文件加载数据，到目前为止我已经正确完成了。

但是我遇到的问题是在点击之前加载第一个json对象，即在页面加载时加载第一个对象

打字稿

export class RequestComponent{
  people: Object[];
  constructor(http:Http){
    http.get('data.json').subscribe(res => {
      this.people = res.json();
    });
  }

  public currentStatus;
  public setThis = (people) => this.currentStatus = people;
}

HTML

  <ul class="col-md-4">
    <li *ngFor="let person of people" (click)="setThis(person)">
      <span><i class="fa fa-cog" aria-hidden="true"></i></span>
      <p>{{ person.name }}</p>
    </li>
  </ul>
   <div *ngIf="currentStatus" class="col-md-8 right-section">
      <h2>{{ currentStatus.name }}</h2>
      <img [src]="currentStatus.img" class="img-responsive"/>
   </div>

Answer 1

尝试在ngOnInit（）函数中加载json。

import { Component, OnInit } from '@angular/core';
// other imports

export class RequestComponent implements ngOnInit{
  people: Object[];

  constructor(private http:Http){}

  ngOnInit(){
      this.http.get('data.json').subscribe(res => {
      this.people = res.json();
    });
  }
}

添加ngIf以显示您的记录，因此在加载people之前不会尝试显示它。

<ul *ngIf="people" class="col-md-4">
    <li *ngFor="let person of people" (click)="setThis(person)">
        <span><i class="fa fa-cog" aria-hidden="true"></i></span>
        <p>{{ person.name }}</p>
    </li>
</ul>
<div *ngIf="currentStatus" class="col-md-8 right-section">
    <h2>{{ currentStatus.name }}</h2>
    <img [src]="currentStatus.img" class="img-responsive" />
</div>

Answer 2

您的页面加载速度通常比从API获得响应的速度快，因此您应该在获得响应后设置订阅者内部的人员，这样您就可以确定它已收到它。

constructor(private http:Http){
    this.http.get('data.json').subscribe(res => {
        this.people = res.json();
        if(this.people && this.people.length>0)
            this.setThis(this.people[0]);
    });
}

根据您的实现，执行if可能更合适，以确保人员数组在setThis中不是空的。

或者，您可以将html更改为

<ul class="col-md-4">
    <li *ngFor="let person of people" (click)="setThis(person)">
        <span><i class="fa fa-cog" aria-hidden="true"></i></span>
        <p>{{ person.name }}</p>
    </li>
</ul>
<div *ngIf="currentStatus>-1" class="col-md-8 right-section">
    <h2>{{ people[currentStatus]?.name }}</h2>
    <img [src]="people[currentStatus]?.img" class="img-responsive"/>
</div>

将currentStatus更改为一个数字并将其默认为0.这样就可以避免在html更新的人时立即将currentStatus分配给第一个人的问题。如果您需要禁用currentStatus部分的显示，只需将其设置为-1即可。

？在.name和.img之前告诉html在尝试访问名称或img之前验证对象是否存在，如果它不存在则不会显示该部分。

Answer 3

试试这个：

#include <string.h>
#include <stdio.h>
#include <sodium/crypto_sign.h>
#include <sodium/crypto_sign_edwards25519sha512batch.h>

// Test vector #1 from http://bittorrent.org/beps/bep_0044.html
// Using libsodium.
int main(int argc, char *argv[])
{
    const char* buf = "3:seqi1e1:v12:Hello World!";

    const char* sk =
        "\xe0\x6d\x31\x83\xd1\x41\x59\x22\x84\x33\xed\x59\x92\x21\xb8\x0b"
        "\xd0\xa5\xce\x83\x52\xe4\xbd\xf0\x26\x2f\x76\x78\x6e\xf1\xc7\x4d"
        "\xb7\xe7\xa9\xfe\xa2\xc0\xeb\x26\x9d\x61\xe3\xb3\x8e\x45\x0a\x22"
        "\xe7\x54\x94\x1a\xc7\x84\x79\xd6\xc5\x4e\x1f\xaf\x60\x37\x88\x1d";

    unsigned char signature[crypto_sign_BYTES];

    crypto_sign_edwards25519sha512batch(
            signature,
            NULL,
            (const unsigned char*) buf,
            strlen(buf),
            (const unsigned char*) sk);

    char signed_buf[crypto_sign_BYTES * 2];

    for (int i = 0; i < sizeof(signature); ++i) {
        sprintf(signed_buf + i*2, "%.2x", signature[i]);
    }

    printf("%s\n", signed_buf);
}

Angular4：从Json

3 个答案: