【问题标题】:How to get the id of an item in an array如何获取数组中某项的id
【发布时间】:2019-05-23 15:35:45
【问题描述】:

我已经使用 PHP 作为我的后端语言从我的数据库中调用了一个项目数组,并且我已经在我的 ionic 视图中正确显示了它,但是我尝试记录每个项目的 id,以便我可以使用它来执行其他任务但它一直给我循环中第一项的 id

下面的代码是 ionic 中的 ts 代码,用于在页面 init 上获取数据

ngOnInit() {
  this.username = this.navParams.get('mobile');
  var headers = new Headers();
  headers.append("Accept", 'application/json');
  headers.append('Content-Type', 'application/json');
  let requestOptions = new RequestOptions({ headers: headers });
  let data = {
    userid: this.username
  };
  this.http.post('http://127.0.0.1:8000/api/myitems', JSON.stringify(data), requestOptions)
  //.timeout(40000)
  .map(res => res.json())
  .subscribe(res => {
    this.items =res.My_data.phone;
    console.log(this.items);
  });
}

下面是点击项目时的代码

Detail(item) {
  console.log(item);
}

这是ionic视图中的html代码

<ion-item *ngFor="let item of items" on-click="Detail()">
  {{item.phone_name}} | {{item.model}} <br> {{item.serial_no}}
</ion-item>

每次我点击它时,项目的 id 都会像 9,10,11,12 这样循环,但它只返回 9

PHP 代码如下(使用 laravel 构建

public function index(Request $request){

    $car=caritem::where('ownerid', $request->userid)->get();
    $comp=Computer::where('ownerid', $request->userid)->get();
    $phone = useritem::where('ownerid', $request->userid)->get();
    $my_data = ['status' => 200, 'Author\'s Name' => "Ademola Segun", 'Api Version' => "v1.0",
        'Purpose' => "Findit App API", 'car' => $car, 'comp'=>$comp, 'phone'=> $phone];
    return response()->json(['My_data'=>$my_data]);

}

【问题讨论】:

  • 你的 PHP 代码在哪里?
  • Detail() 什么都没通过?
  • 请检查,我已更新问题以包含 php 代码,但它可以正常获取项目
  • details 只是在 ionic html 页面中显示后在点击它时记录项目的 id
  • @user7310495 在您的代码中,您没有将任何内容传递给 Detail 函数,但在您的离子控制器中,您正在使用带参数的 Detail ??

标签: javascript angular typescript ionic3


【解决方案1】:

首先,你的 Detail() 函数正在等待一个参数,而你的 html 中你没有给它,

像这样更新你的html:

&lt;ion-item *ngFor="let item of items" on-click="Detail(item)"&gt; .... &lt;/ion-item&gt;

在你的 ts 中你应该得到一个带有 id 的对象

【讨论】:

  • 谢谢,这解决了我的麻烦
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-06-25
  • 2021-07-08
  • 2015-08-26
  • 2016-12-24
相关资源
最近更新 更多