相关疑难解决方法(0)

我有点困惑如何获取key并value同时使用angular2对象的*ngFor用于遍历的对象.我知道在角度1.x中有一个类似的语法

ng-repeat="(key, value) in demo"

但我不知道如何在angular2中做同样的事情.我尝试过类似的东西,没有成功:

<ul>
  <li *ngFor='#key of demo'>{{key}}</li>
</ul>

demo = {
    'key1': [{'key11':'value11'}, {'key12':'value12'}],
    'key2': [{'key21':'value21'}, {'key22':'value22'}],
  }

以下是我的尝试:http ://plnkr.co/edit/mIj619FncOpfdwrR0KeG?p=preview

我怎样才能获得key1并key2动态使用*ngFor？经过广泛搜索后,我发现了使用管道的想法,但我不知道如何去做.是否有任何内置管道在angular2中做同样的事情？

我有这个枚举(我正在使用TypeScript):

export enum CountryCodeEnum {
    France = 1,
    Belgium = 2
}

我想在我的表单中构建一个select,每个选项的枚举整数值为value,枚举文本为label,如下所示:

<select>
     <option value="1">France</option>
     <option value="2">Belgium</option>
</select>

我怎样才能做到这一点 ？

这篇文章是关于我在工作中发现的一个有趣问题.

如果你还不知道.我在谈论Angular 2+

问题

因此,您希望显示列表的标记,此列表的值来自后端,并且由于某种原因而不是您收到类似的旧对象数组.

    { 
  "car" : 
    { 
       "color" : "red",
       "model" : "2013"
    },
   "motorcycle": 
    { 
       "color" : "red",
       "model" : "2016"
    },
   "bicycle": 
    { 
       "color" : "red",
       "model" : "2011"
    }
}

然后尝试使用*ngFor但会出现一条错误消息:

Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

你可以在后端修复它,这样你就可以得到一个对象数组,但是并不是没有时间.你不担心孩子,我有我们.

我正在使用ngFor循环8个json对象,我不仅要循环值,还要计算循环值的数量并显示数字.

例如,如果json值为

Content:{
0:"Content1",
1:"Content2",
2:"Content3",
3:"Content4",
4:"Content5",
5:"Content6",
6:"Content7",
7:"Content8"
}

我不仅要显示'内容'的循环值,还要计算它们,以便结果如下所示.

1 <- counting
Content1

2
Content2

3
Content3

4
Content4

5
Content5

6
Content6

7
Content7

8
Content8

我一直在挖掘,发现我可以使用以下内容在对象上使用*ngFor:

 <div *ngFor="#obj of objs | ObjNgFor">...</div>

其中ObjNgFor管道是:

@Pipe({ name: 'ObjNgFor',  pure: false })
export class ObjNgFor implements PipeTransform {
    transform(value: any, args: any[] = null): any {
        return Object.keys(value).map(key => value[key]);
    }
}

但是,当我有这样的对象时:

{
"propertyA":{
    "description":"this is the propertyA",
    "default":"sth"
 },
"propertyB":{
    "description":"this is the propertyB",
    "default":"sth"
 }
}

我不太确定如何提取'propertyA'和'propertyB',以便可以从*ngFor指令访问它.有任何想法吗？

UPDATE

我想要做的是呈现以下HTML:

        <div *ngFor="#obj of objs | ObjNgFor" class="parameters-container">
            <div class="parameter-desc">
                {{SOMETHING}}:{{obj.description}}
            </div>
        </div>

什么东西等于propertyA和propertyB(这是对象的结构).所以,这会导致:

propertyA:this is the propertyA
propertyB:this is the …

我从网络服务器获得以下 JSON 字符串。

[
{"name":"Joe Lincoln","age":"42","grade":"9","active":"1"},
{"name":"Jack Smith","age":"38","grade":"8","active":"1"},
{"name":"Peter Smith","age":"42","grade":"9","active":"0"},
{"name":"Eva Lorens","age":"42","grade":"8","active":"1"},
]

我想在 HTML 中公开 JSON，我尝试了以下操作，但是字段没有被填充，我也没有异常，所以我很难找出为什么它不起作用。

TS

  this.servletService.webserviceCall('MemberUnit', 'getMembers',  params).then((obs)=>{
      obs.subscribe(
          (data) => {
            this.members =  JSON.parse(data);
          }); 
    }) 

HTML

 <ion-item *ngFor="let member of members">
 <ion-avatar item-left>
       <svg width="75px" height="75px" >
   <text x="50%" y="50%" text-anchor="middle" stroke="#2980b9" stroke-width="2px" dy=".1em">{{member.grade }}</text>
      </svg>
      </ion-avatar>
       <h2>{{member.name}}</h2>
      <h3>{{member.age}}</h3>
    </ion-item>

嗨我使用Angular 2管道返回对象的键,它是一个不纯的管道,它被执行多次,阻止其他一些脚本,我怎么能避免多次执行不纯的管道？我的代码如下:

 import {Pipe,PipeTransform} from '@angular/core';
    @Pipe({ name: 'NgforObjPipe', pure: true })
    export class NgforObjPipe implements PipeTransform {
        transform(value, args:string[]):any {
        let keys = [];
        for (let key in value) {
            keys.push({key: key, value: value[key]});
        }
        console.log('pipeeeeeeeeeeeeeee', keys);
        return keys;
        }
    }

我想迭代对象中的键值对并每行显示两个项目。我查看了其他示例，例如这个示例，但我不知道如何向其添加键值。

这是我的代码：

<div *ngFor="let item of book.bookData.privateData | keyvalue; index as i; let even = even">
    <div fxFlex="100" fxLayout="row" *ngIf="even">
        <div fxFlex="50" fxLayout="column">
            Key: <b>{{book.bookData.privateData[i].key}}</b> and Value: <b>{{book.bookData.privateData[i].value}}</b>
        </div>
        <div fxFlex="50" fxLayout="column">
            Key: <b>{{book.bookData.privateData[i+1].key}}</b> and Value: <b>{{book.bookData.privateData[i+1].value}}</b>
        </div>
    </div>
</div>

这不起作用，因为对象上没有key和value属性privateData，属性被分配给item。

预先感谢您的任何帮助！

编辑：

以下是我想要实现的目标的一个工作示例，但这显然不是一种有效的方法：

<div *ngFor="let item of bookState.bookData.privateData | keyvalue; index as i; let even = even">
    <div fxFlex="100" fxLayout="row" *ngIf="even">
        <div fxFlex="50">
            <div *ngFor="let deeperItem1 of bookState.bookData.privateData | …

是的,我看到其他人得到了这个错误,我只是不知道如何在我的代码中修复它

private _url = 'https://min-api.cryptocompare.com/data/pricemulti?fsyms=BTC,ETH,LTC,EOS,DASH&tsyms=USD'

如果我没有return它没有崩溃与错误,但我确实想要返回数据.

我有一个调用此方法的组件(在此服务ts文件中)

订户:

getAllCoins() {

    var blah = [];

    return this.getCoins().subscribe(
        data => {
            blah = data;               
            //console.log('subscriber coins', blah)
        }
    )

}

调用此代码

getCoins() {
    return this.http.get(this._url)
        .map((response: Response) => response.json())
        //.do(data => console.log(data))
        .do(data => console.log('All: ' + JSON.stringify(data)))  // do operator to peek 
        .catch(this.handleError);
}

现在,我看到来自url的数据看起来像这样

{
"BTC": {
  "USD": 3349.1
},
"ETH": {
  "USD": 296.3
},
"LTC": {
  "USD": 47.56
},
"EOS": {
  "USD": 1.83
},
"DASH": {
  "USD": …

我正在尝试遍历内容。我尝试了一些在StackOverflow中找到的答案，但没有一个适合我。

我有这个JSON

{  
   "-KmdNgomUUnfV8fkzne_":{  
      "name":"Abastecimento"
   },
   "-KmdNgzguGKbCEfyQ3F0":{  
      "name":"Consórcios"
   },
   "-KmdNh9_jtBlFqY1Y_Rj":{  
      "name":"Consultoria aeronáutica"
   },
   "-KmdNhKNCVEiJ2Ou8bUV":{  
      "name":"Cursos e treinamentos"
   },
   "-KmdNhVRoKfaCM--304M":{  
      "name":"Financiamento"
   },
   "-KmdNhfIC6fA0kDJcVBq":{  
      "name":"Hangaragem"
   },
   "-KmdNhu0X-PteQMyHp_n":{  
      "name":"Mecânica"
   },
   "-KmdNi6ZmmYXnoOTXoC5":{  
      "name":"Táxi Aéreo"
   },
   "-KmdNiHFhiX_crXB1L2R":{  
      "name":"Outros"
   }
}

我正在尝试循环使用此代码

<button ion-item *ngFor="let cat of subcategories" (click)="onSubcategorySelect(cat)">
              {{ cat.name }} 
</button>

没用 我究竟做错了什么？