html - 通过 Angular 使用 JSON 字符串数组填充 html 选择

Question

我想将 jsonArray 转换为角度字符串，然后将其显示为 html 中的选择（下拉选择器）。

JSON 网址如下所示：

[
    "100 - BISCUIT - 546156",
    "252 - CHOCO - 185268",
    "131 - CANDY - 478215"
]

我的.service.ts：

import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { Observable } from 'rxjs';

@Injectable()
export class MyService {

    //Json Url
    private jsonUrl = 'localhost:8080/jsonurl';

    constructor(private http: Http) {
    }

    public getContentFromApi() {
        return this.http.get(this.jsonUrl);
    }
 }

我在 store.component.ts 和 app.component 文件中导入了服务

import { Component, OnInit } from '@angular/core';
import { MyService } from '../../services/my.service'

@Component({
  selector: 'app-store',
  templateUrl: './store.component.html',
  styleUrls: ['./store.component.css'],
  providers: [MyService]
})

export class StoreComponent implements OnInit {
  selectedValue: any;
  storeItems: any;
  si: myService;



  constructor(){ }

  ngOnInit() {
    this.storeItems = this.si.getContentFromApi;
  }


  getStoreItems() {
    return this.storeItems;
   }


}

store.component.html

<div class="alignment">
  <p class="lev">Store Items: 
    <select [(ngModel)]="selectedValue"><option *ngFor="let s of storeitems" [ngValue]="s">{{storeitems}}</option></select></p>
</div>

据我所知，我的 getcontentFromApi 方法不正确，并且绑定到 html select 不起作用。