有 2 个组件：parentComponent 和 ChildComponent，它们定义在父级内部。在 parentComponent 中有一个局部变量，它用作传递给 ChildComponent 的输入属性的值（使用 getter）。
父组件.ts：
@Component({
selector:'parent-component',
template:`
<h1>parent component</h1>
<child-component [personData]="PersonData"></child-component>
`
})
export class ParentComponent{
personData:Person;
get PersonData():Person{
return this.personData;
}
set PersonData(person:Person){
this.personData = person;
}
ngOnInit(){
this.PersonData = new Person();
this.PersonData.firstName = "David";
}
//more code here...
}
ChildComponent.ts：
@Component({
selector:'child-component',
template:`
<h1>child component</h1>
<div *ngIf="personData">{{personData.firstName}}</div>
`
})
export class ChildComponent{
@Input() personData:Person;
//more code here...
}
问题是：在父组件的某个地方，当特定事件发生时，会调用一个函数newPersonArrived(newPerson:PersonData)，函数代码如下：
newPersonArrived(newPerson:Person){
this.PersonData = newPerson;
}
这不会影响具有新人名的 UI！
只有以下有帮助：
newPersonArrived(newPerson:Person){
this.PersonData = new …我想从动态键的json数组中获取键和值.意思是,我事先并不知道钥匙是什么.
这是函数获取的json的一个示例:
arr = [
{key1: 'val1'},
{key2: 'val2'},
{key3: 'val3'}
];
这对我来说似乎很简单,但我无法获得每个项目的关键和价值.
这是我试过的(基于这个管道):
for (let key of arr) {
console.log ('key: ' + key + ', value: ' + arr[key]);
}
但是我在日志中得到的是以下内容:
key:[object Object], value: undefined
我的预期行为是获得以下内容:
key:key1, value:val1
我究竟做错了什么？我怎样才能获得密钥和值？
在 Angular2 应用程序中，我有一个表单（“FormGroup”）。
表格上有几个表格。
this.mainForm = this.fb.group({
firstPart:this.firstForm,
secondPart:this.secondForm,
thirdPart:this.thirdForm
....
});
我的要求是，在我的代码中的某个地方，我需要检查一个表单（不是主表单，而是一些内部表单）是否处于焦点。
其实我需要这样的东西。：
isFormInFocus(formName) {
let innerForm = this.mainForm.controls[formName];
//NOT EXIST - I need something like this...
return innerForm.focus;
}
我的问题是我什至找不到如何检查特定表单控件的方法。
如果我知道这一点，作为一种解决方法，我可以在内部表单中循环所有表单控件并检查其中一个是否处于焦点...
有任何想法吗？
我有一个 Utilities 类，上面有一些静态方法。
在一种方法中，我想获取一个对象并返回其图像的安全样式。
问题是我需要使用 DomSanitizer 服务，而我无法在静态方法中使用它。这是代码：
export class Utilities{
constructor(private sanitizer:DomSanitizer){
}
static getImageStyle(obj){
return this.sanitizer.bypassSecurityTrustStyle(`url(data:image/jpg;base64,${obj.image})`);
}
}
这是否需要在非静态方法中完成，并且每次使用此函数时我都应该创建类的实例？
我的要求是将代码中的事件触发到父托管组件.
我在这里使用第一个答案作为参考:angular2手动触发特定元素上的click事件
如果我尝试这个,它运作良好:
this.itemHost.viewContainerRef.element.nativeElement.dispatchEvent(new Event('click'));
在父组件中我写了这个:
(click)="go()"
当上述代码出现时,它到达go方法.
但是,如果我使用一些自定义事件名称,这不起作用,例如:
this.itemHost.viewContainerRef.element.nativeElement.dispatchEvent(new Event('customEvent'));
并在父组件中:
(customEvent)="go()"
如何使用自定义事件进行操作？
我有一个订阅内部服务的功能：
selectCar(carNumber) {
this.carService.getCarByNumerator(carNumber)
.subscribe( (car) => {
console.log(carNumber);
//more stuff here
},
(err) => console.log(err)
);
}
我想在 for 循环中调用这个函数，如下所示：
for(let carNumber of carNumbers) {
this.selectCar(carNumber);
}
问题是，有时它会按我的预期工作，但有时顺序与列表中的顺序不同。
例如列表是：
45
67
89
但是当我查看控制台时，我看到以下内容：
67
89
45
如何强制 for 循环在当前函数调用完成之前不转到下一项？