Question

我是Angular的新手，我试图创建一些示例应用程序，但出现错误。请帮忙。我正在尝试从Googles项目（https://stackblitz.com/angular/ooqemvjyqkb?file=src%2Fapp%2Fheroes%2Fheroes.component.ts）中创建自己的项目当我从“用户=用户[];”中删除数组时它工作正常，但没有给出构建（[ts]类型'User []'不能分配给'typeof User'类型。）。使用“用户=用户[];”它甚至不编译（建议[ts]元素访问表达式应带有一个参数。（任意））。

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

import { User } from '../user';
import { UserService } from '../user.service';

@Component({
  selector: 'app-users',
  templateUrl: './users.component.html',
  styleUrls: ['./users.component.css']
})
export class UsersComponent implements OnInit {

  selectedUser: User;

  users = User[]; // review use of array type. users = User[];

  constructor(
    private userService: UserService
    ) { }

  ngOnInit() {
    this.getUsers();
  }

  onSelect(user: User): void {
    this.selectedUser = user;
  }

  getUsers(): void {
    this.userService.getUsers()
    .subscribe(users => this.users = users);
  }

    save(): void {
    this.userService.updateUser(this.users);
  }

  add(name: string): void {
    console.log(name);
    name = name.trim();
    if (!name) { return; }
    this.userService.addUser({ name } as User)
      .subscribe(user => {
        this.users.push(user);
      });
  }
}

//////////////////// user.ts ///////////////

export class User {
    id: number;
    name: string;
  }

/////////////// user.service.ts /////////////////

import { Injectable } from '@angular/core';
import { Observable, of } from 'rxjs';
import { HttpClient, HttpHeaders } from '@angular/common/http';

import { User } from './user';
// import { USERS } from '../assets/data/userData';

const httpOptions = {
  headers: new HttpHeaders({ 'Content-Type': 'application/json' })
};

@Injectable({ providedIn: 'root' })

export class UserService {

  private usersUrl = 'api/users';

  constructor(
    private http: HttpClient) { }

  getUsers(): Observable<User[]> {
    // return of(USERS);
    return this.http.get<User[]>(this.usersUrl);
  }

  /** GET user by id. Will 404 if id not found */
getUser(id: number): Observable<User> {
  const url = `${this.usersUrl}/${id}`;
  return this.http.get<User>(url);
}

/** PUT: update the user on the server */
updateUser (user: User): Observable<any> {
  return this.http.put(this.usersUrl, user, httpOptions);
}

/** POST: add a new user to the server */
addUser (user: User): Observable<User> {
  return this.http.post<User>(this.usersUrl, user, httpOptions);
}

/* GET users whose name contains search term */
searchUsers(term: string): Observable<User[]> {
  if (!term.trim()) {
    // if not search term, return empty hero array.
    return of([]);
  }
  return this.http.get<User[]>(`${this.usersUrl}/?name=${term}`);
}

}

Answer 1

替换

users = User[];

与

user: User[]

应该可以解决问题。

Answer 2

尝试：

    users = [Users];

我发现语法倾向于更好地工作。

Answer 3

就像某些人以前写的那样，您尝试向仅需要一个用户的方法中添加User[]，这是一个数组。通过编写以下代码，您可以访问arry的一个元素：

save(): void {
    this.userService.updateUser(this.users[THE_INDEX_FROM_THE_CURRENT_USER]);
}

那应该只给User一个updateUser()

所以通常：

oneArray: Foo[];         <-   creates an array named 'oneArray' with Foo objects inside
oneFoo = oneArray[0];    <-   Gives you the first element of the array

Answer 4

对我来说正确的语法是不是

user: User[] = User[]

但是

users: User[] = []

或

users: User[] = new Array<User>()

Answer 5

我只是试图用tsc编译一个独立的打字稿文件而遇到这个问题。就我而言，我必须更改此设置：

users: User[];

对此：

let users: User[];

Answer 6

请勿添加用户= User []，因为您正在从服务中获取用户。而是像这样声明类型用户：User [];

以上将工作

元素访问表达式应带有一个参数

6 个答案: