我正在尝试 Angular 2 beta，并希望使用 Semantic UI Dropdown 控件作为 Angular 2 组件。
http://semantic-ui.com/modules/dropdown.html#converting-form-elements
我的小示例项目在这里:
https://github.com/uNki23/angular2semantic/
我已将其包装在 Angular 2 组件“UiSelectComponent”内，如下所示:
https://github.com/uNki23/angular2semantic/blob/master/src/app/components/ui-select.component.ts
任何其他组件都应通过向其传递两个对象来使用 UiSelectComponent:一个包含可能选择的数组和一个可选的预定义选定选项。我为选择“SelectOption”创建了一个界面，它有两个属性“value”(数字)和“displayValue”(字符串)。该组件应该像这样使用:
https://github.com/uNki23/angular2semantic/blob/master/src/app/components/app.component.html
第一个问题: 我想要实现的是，预先选择的选项被传递到 UiSelectComponent，用户选择更改该选项并且该选项还应该更改从父组件中选择的对象。很明显，父组件需要知道，从 UiSelectComponent 中选择的选项是什么，对吧？
第二个问题: 如果我将 .dropdown() 函数包装在 setTimeout() 函数中，则在语义 ui 下拉列表中设置初始选定选项才有效。我想，Angular 2 不再需要那些东西来使更改可见？
过去两天我已经尝试了所有可能的方法 - 现在我需要你的帮助:)
提前致谢!!
最佳答案
第一个问题:当您更改子级中的某些内容时，您可以使用输出(EventEmitter)属性并向父级发出事件。您的父模板需要监听此事件:<child (someChildEvent)="myCallback()" ...>。
但是，如果您要共享的选项数据位于要传递给子对象的对象内部 - <child [someChildProperty]="sharedObj" ...> ，则父对象和子对象都引用相同/一个 sharedObj ，因此您在子项在父项中可见。 EventEmitter 可能是更好的选择，因为这样您实际上可以在更改发生时通知父级...但事件实际上不必传递任何值，因为父级已经可以看到对 sharedObj 所做的任何更改。
第二个问题:我没有查看您的代码，但您可能需要超时，因为您可能需要等待第 3 方组件渲染或完成初始化。
关于Angular 2 组件与对象的双向数据绑定(bind)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34828726/