Question

我从我的mysql数据库中获取带有角度http的数据，并且最后一个字段包含由“;”分隔的数据但它只是一个字符串。

现在我希望每个值都有一个html元素。但最重要的是，我想要数据库中的每条记录。

我想到了这样的事情：（Template）Pipe将String转换为数组

        <li *ngFor="let form of data">

       {{form.idform_data}} - {{form.form_name}} -
         {{form.field_name}} - {{form.field_type}} -
         {{form.field_desc}} -
       <ng-template *ngFor = "let item of  {{form.field_data | splitAndGet : ";"}}">
         {{item}}
        </ng-template>
 </li>

但是这不起作用，因为错误是意外的结束标记“li”

如果您需要更多代码，请告诉我。

非常感谢一些帮助！

Edit1：关闭ng-template标签

错误现在是Key [0]未定义但我知道数组包含值

Edit2：代码数据收集

import { Component } from '@angular/core';
import { Injectable }              from '@angular/core';
import { Http, Response }          from '@angular/http';

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
private data;


constructor(private http:Http){
}

ngOnInit(){
  console.log("ngOnInit");
    this.getData();

}

getData(){
    console.log("fetching Data");
    this.http.get('http://192.168.178.42/getFormDbData.php')  //Pfad zur php datei
            .subscribe(response =>{ this.data = response.json()
                                console.log(JSON.stringify(response.json()))});


}
}

管道：

import { Pipe, PipeTransform } from '@angular/core';


@Pipe({ name: "splitAndGet" })
export class SplitAndGetPipe implements PipeTransform {
  transform(input: string, separator: string, index:number): any {
    var splitarr = input.split(separator);
    return splitarr;
  }
}

编辑：谢谢你的帮助。还要感谢Downvoting帮助像我这样开始学习的人。

Answer 1

所以，我知道，感谢@ developer033 我不知道我不在变量中使用插值。

    <li *ngFor="let form of data">

       {{form.idform_data}} - {{form.form_name}} -
         {{form.field_name}} - {{form.field_type}} -
         {{form.field_desc}} -
        <div *ngFor = "let item of form.field_data | splitAndGet : ';'">
         <p>{{item}}</p>
     </div>
 </li>

角度嵌套循环

1 个答案: