AngularDart 组件和模型绑定答案

【问题标题】：AngularDart components and model bindingAngularDart 组件和模型绑定
【发布时间】：2014-01-12 11:12:03
【问题描述】：

是否可以将 AngularDart ngComponent 绑定到模型，然后从组件中操作该模型并查看 ngComponent 之外的更改。例如

<myawsomecomponent ng-model="{{name}}"></myawesomecomponent>
<label>{{name}}</label>

myAwesomeComponent 将对模型执行某种魔法（例如将所有字母大写），并且应该反映在组件之外。

在 AngularDart 中执行此类操作的最佳方法是什么？

【问题讨论】：

【解决方案1】：

好问题！要完成此任务，您需要将NgModel 指令注入myAwesomeComponent。然后就可以通过NgModel.modelValue获取和设置模型了。

@NgComponent(
  selector: 'myawesomecomponent',
  ...
)
class MyAwesomeComponent {
  NgModel _ngModel;
  MyAwesomeComponent(this._ngModel);

  ...
}

通过将ng-model 属性添加到您的元素，Angular 会创建一个NgModel 指令。注入系统将为您的特定元素提供NgModel。

看看其他NgModel指令是怎么写的，比如InputCheckboxDirective

【讨论】：

另外一个问题，看了代码后，我看到了NgModel中的modelValue和viewValue属性。有什么区别？我还看到 inputCheckbox 的 scope.$apply 被称为 onInputChange。这是什么原因？换句话说，我什么时候需要调用scope.$apply？谢谢。
modelValue 和 viewValue 一旦实施转换器就会不同（例如 viewValue 可能是“4388 1200 6000 5344”，其中 modelValue 可能是“4388120060005344”）它没有价值，应该被删除。（欢迎 PR！）