将一些事件信息从子组件发送到父组件
Sending some event info from a child component to the parent component
我想将一个 int 值从子组件传递到其父组件。事件本身正确到达,但我在父级的接收方法中添加事件参数失败。
更新: 编辑代码以缩小,但完整示例
import 'package:angular2/core.dart';
class MyItem {
int id = 1;
}
@Component(
selector: 'my-list',
directives: const [MyListItem],
template: '''
<div *ngFor='let myItem of myItems'>
<my-list-item [myItem]='myItem' (dirtiesParent)='doInit($event)'></my-list-item>
</div>
''')
class MyList {
@Input()
List<MyItem> myItems = [ new MyItem() ];
void doInit() {
print("got event");
}
}
@Component(
selector: 'my-list-item',
template: '''
<div>id {{myItem.id}}<button (click)='doDelete()'>delete</button></div>
''')
class MyListItem {
@Input()
MyItem myItem;
@Output()
EventEmitter<int> dirtiesParent = new EventEmitter();
void doDelete() {
dirtiesParent.add(myItem.id);
}
}
我认为你只是不正确地逃脱了 $
。试试这个:
class MyItem {
int id = 1;
}
@Component(
selector: 'my-list',
directives: const [MyListItem],
template: '''
<div *ngFor='let myItem of myItems'>
<my-list-item [myItem]='myItem' (dirtiesParent)='doInit($event)'></my-list-item>
</div>
''')
class MyList {
@Input()
List<MyItem> myItems = [new MyItem()];
void doInit(int id) {
print("got event for id $id");
}
}
@Component(
selector: 'my-list-item',
template: '''
<div>id {{myItem.id}}<button (click)='doDelete()'>delete</button></div>
''')
class MyListItem {
@Input()
MyItem myItem;
@Output()
EventEmitter<int> dirtiesParent = new EventEmitter();
void doDelete() {
dirtiesParent.add(myItem.id);
}
}
这对我有用(它打印 "got event for id 1")。请注意,我还将预期参数添加到 doInit()
.
我想将一个 int 值从子组件传递到其父组件。事件本身正确到达,但我在父级的接收方法中添加事件参数失败。
更新: 编辑代码以缩小,但完整示例
import 'package:angular2/core.dart';
class MyItem {
int id = 1;
}
@Component(
selector: 'my-list',
directives: const [MyListItem],
template: '''
<div *ngFor='let myItem of myItems'>
<my-list-item [myItem]='myItem' (dirtiesParent)='doInit($event)'></my-list-item>
</div>
''')
class MyList {
@Input()
List<MyItem> myItems = [ new MyItem() ];
void doInit() {
print("got event");
}
}
@Component(
selector: 'my-list-item',
template: '''
<div>id {{myItem.id}}<button (click)='doDelete()'>delete</button></div>
''')
class MyListItem {
@Input()
MyItem myItem;
@Output()
EventEmitter<int> dirtiesParent = new EventEmitter();
void doDelete() {
dirtiesParent.add(myItem.id);
}
}
我认为你只是不正确地逃脱了 $
。试试这个:
class MyItem {
int id = 1;
}
@Component(
selector: 'my-list',
directives: const [MyListItem],
template: '''
<div *ngFor='let myItem of myItems'>
<my-list-item [myItem]='myItem' (dirtiesParent)='doInit($event)'></my-list-item>
</div>
''')
class MyList {
@Input()
List<MyItem> myItems = [new MyItem()];
void doInit(int id) {
print("got event for id $id");
}
}
@Component(
selector: 'my-list-item',
template: '''
<div>id {{myItem.id}}<button (click)='doDelete()'>delete</button></div>
''')
class MyListItem {
@Input()
MyItem myItem;
@Output()
EventEmitter<int> dirtiesParent = new EventEmitter();
void doDelete() {
dirtiesParent.add(myItem.id);
}
}
这对我有用(它打印 "got event for id 1")。请注意,我还将预期参数添加到 doInit()
.