Question

大家好我试图将jquery应用转换为Ionic。我在UI更改事件中使用了一个json对象数组从一组值切换到其他值。这是我用过的表的一部分

var table = {};
    table['0']  = {stipendio:716.73,base:531.52,ivmg:185.21,f025:7.21,f2650:14.42,f5170:21.63,f71:28.84};
    table['1']  = {stipendio:716.73,base:531.52,ivmg:185.21,f025:7.21,f2650:14.42,f5170:21.63,f71:28.84};
    table['2']  = {stipendio:899.44,base:638.39,ivmg:261.05,f025:8.08,f2650:16.16,f5170:24.24,f71:32.32};
...
...

然后我用一个选择器来选择要使用哪一行：

selected = $("#seniority").val()
paramsToUse = table[selected];

所以我可以使用paramsToUse作为json对象来获取我需要的值。

如何使用Typescript获得相同的结果？

Answer 1

您可以使用What special characters must be escaped in regular expressions?选择一个表格：

// On your .html file
<ion-list>
  <ion-item>
    <ion-label>Table</ion-label>
    <ion-select [(ngModel)]="tablePosition" (ngModelChange)="selectTable()">
      <ion-option value="0">First</ion-option>
      <ion-option value="1">Second</ion-option>
      <ion-option value="2">Third</ion-option>
    </ion-select>
  </ion-item> 
</ion-list>

// On your .ts file
private table: object[];
private paramsToUse: object;
private tablePosition: number;

private selectTable() {
  this.paramsToUse = table[this.tablePosition];
}

假设您的table可能是一个对象数组

Answer 2

好的伙计们，谢谢大家。

我已经使用

工作了

table = [
{stipendio:716.73,base:531.52,ivmg:185.21,f025:7.21,f2650:14.42,f5170:21.63,f71:28.84},
{stipendio:716.73,base:531.52,ivmg:185.21,f025:7.21,f2650:14.42,f5170:21.63,f71:28.84},
{stipendio:716.73,base:531.52,ivmg:185.21,f025:7.21,f2650:14.42,f5170:21.63,f71:28.84}
]

比我想象的容易得多。

再次感谢大家

Answer 3

在你的评论中你想知道如何创建一个数组，而不是使用你在答案中所做的表（sudo-array），但我还将向你展示如何使用NgFor轻松扩展它。

您的表格如下：

var table = {};
table['0']  = {stipendio:716.73,base:531.52,ivmg:185.21,f025:7.21,f2650:14.42,f5170:21.63,f71:28.84};
table['1']  = {stipendio:716.73,base:531.52,ivmg:185.21,f025:7.21,f2650:14.42,f5170:21.63,f71:28.84};
table['2']  = {stipendio:899.44,base:638.39,ivmg:261.05,f025:8.08,f2650:16.16,f5170:24.24,f71:32.32};

在Typescript中，更优化的版本看起来更像是这样：

// let is better than var because scoping issues
let table = [
  // You can put objects directly into arrays, like this. It automatically assigns indexes
  // so if you need to manually assign them it will be more complicated.
  {stipendio:716.73,base:531.52,ivmg:185.21,f025:7.21,f2650:14.42,f5170:21.63,f71:28.84},
  {stipendio:716.73,base:531.52,ivmg:185.21,f025:7.21,f2650:14.42,f5170:21.63,f71:28.84},
  {stipendio:899.44,base:638.39,ivmg:261.05,f025:8.08,f2650:16.16,f5170:24.24,f71:32.32},
  // ...etc
];

如果您在组件上使用它，我会假设您使用this.table而不是let table，但我不知道您的其余代码。

稍后，在您的代码中，您可以使用精彩的NgFor来使用您的选择（取自@ akz92＆＃39;答案）

<ion-list>
  <ion-item>
    <ion-label>Table</ion-label>
    <ion-select [(ngModel)]="tablePosition" (ngModelChange)="selectTable()">
      <ion-option *ngFor="let value of table; i = index" [value]="i">{{value.stipendio}}</ion-option>
    </ion-select>
  </ion-item> 
</ion-list>

打字稿json数组硬编码

3 个答案: