相关疑难解决方法(0)

使用*ngFor访问键和对象的值

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

ng-repeat="(key, value) in demo"
Run Code Online (Sandbox Code Playgroud)

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

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

demo = {
    'key1': [{'key11':'value11'}, {'key12':'value12'}],
    'key2': [{'key21':'value21'}, {'key22':'value22'}],
  }
Run Code Online (Sandbox Code Playgroud)

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

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

object typescript angular

349
推荐指数
14
解决办法
34万
查看次数

如何获取TypeScript枚举条目的名称?

我想知道如何迭代TypeScript枚举和每个枚举的符号名称.

例如,

enum myEnum { entry1, entry2 }

for (var entry in myEnum) { 
    // use entry's name here, e.g., "entry1"
}
Run Code Online (Sandbox Code Playgroud)

enums typescript

253
推荐指数
26
解决办法
23万
查看次数

如何在Angular2 ngSwitch语句中使用typescript枚举值

Typescript枚举似乎与Angular2的ngSwitch指令自然匹配.但是当我尝试在我的组件模板中使用枚举时,我得到"无法读取未定义的属性'xxx'......".如何在组件模板中使用枚举值?

请注意,这与基于枚举(ngFor)的所有值创建html选择选项的方法不同.这个问题是关于ngSwitch基于枚举的特定值.虽然出现了创建枚举类的内部引用的相同方法.

typescript angular

130
推荐指数
6
解决办法
12万
查看次数

如何使用*ngFor迭代对象键

我想在Angular 2中使用*ngFor迭代[object object].

问题是对象不是对象数组而是包含更多对象的对象对象.

{

  "data": {
    "id": 834,
    "first_name": "GS",
    "last_name": "Shahid",
    "phone": "03215110224",
    "role": null,
    "email": "test@example.com",
    "picture": **{ <-- I want to get thumb: url but not able to fetch that**
      "url": null,
      "thumb": {
        "url": null
      }
    },
    "address": "Nishtar Colony",
    "city_id": 2,
    "provider": "email",
    "uid": "test@example.com"
  }
}
Run Code Online (Sandbox Code Playgroud)

我知道我们可以使用管道迭代对象,但我们如何能够从对象进一步迭代意味着data-> picture-> thum:url.

ionic2 angular

58
推荐指数
6
解决办法
10万
查看次数

我如何使用ngFor作为字符串数组迭代Typescript Enum

我正在使用Angular2和Typscript.我有一个枚举:

export enum Role {
    ServiceAdmin, CompanyAdmin, Foreman, AgentForeman, 
    CrewMember, AgentCrewMember, Customer
}
Run Code Online (Sandbox Code Playgroud)

我想使用*ngFor迭代枚举.做这个的最好方式是什么?我必须创建一个管道吗?或者有更简单的方法吗?

angular2-template angular

49
推荐指数
7
解决办法
4万
查看次数

Angular2从HTML模板访问全局变量

我有一个全局变量来存储这样的国家/地区列表:

export var COUNTRY_CODES = ["AD", "AE", "AF" /* and more */];
Run Code Online (Sandbox Code Playgroud)

在我的一个组件中,我使用普通的import语句导入了变量

import { COUNTRY_CODES } from "../constants";
Run Code Online (Sandbox Code Playgroud)

我可以在组件代码中自由访问这个全局变量,但是在HTML模板上无法实现这样的功能:

<option *ngFor="let countryCode of COUNTRY_CODES" [value]="countryCode">{{countryCode | countryName}}</option>
Run Code Online (Sandbox Code Playgroud)

我可以通过定义局部变量将全局变量传递给组件,并在初始化期间为其分配全局变量.

ngOnInit() {
  this.countryCodes = COUNTRY_CODES;
}
Run Code Online (Sandbox Code Playgroud)

并更改ngFor此局部变量的to循环以使其工作.

我的问题:这是正确的方法吗?每次我想在模板中使用全局变量时,我都不太习惯定义桥接变量.

angular

27
推荐指数
1
解决办法
2万
查看次数

如何使用*ngFor迭代对象键?

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

 <div *ngFor="#obj of objs | ObjNgFor">...</div>
Run Code Online (Sandbox Code Playgroud)

其中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]);
    }
}
Run Code Online (Sandbox Code Playgroud)

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

{
"propertyA":{
    "description":"this is the propertyA",
    "default":"sth"
 },
"propertyB":{
    "description":"this is the propertyB",
    "default":"sth"
 }
}
Run Code Online (Sandbox Code Playgroud)

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

UPDATE

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

        <div *ngFor="#obj of objs | ObjNgFor" class="parameters-container">
            <div class="parameter-desc">
                {{SOMETHING}}:{{obj.description}}
            </div>
        </div>
Run Code Online (Sandbox Code Playgroud)

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

propertyA:this is the propertyA
propertyB:this is the …
Run Code Online (Sandbox Code Playgroud)

object typescript ngfor angular

11
推荐指数
3
解决办法
2万
查看次数

标签 统计

angular ×6

typescript ×4

object ×2

angular2-template ×1

enums ×1

ionic2 ×1

ngfor ×1