AngularDart组件和模型绑定 [英] AngularDart components and model binding

问题描述

是否有可能一个AngularDart ngComponent绑定到模型，然后操纵从组件模型和看到的ngComponent以外的变化以外的变化。例如：

Is it possible to bind an AngularDart ngComponent to a model and then manipulate that model from the component and see the changes outside of the changes outside of ngComponent. For example

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

myAwesomeComponent会做某种魔法（比如大写所有字母）的模型，并应当组件之外体现。

myAwesomeComponent will do some kind of magic (for example capitalise all letters) to the model and that should be reflected outside of the component.

什么是做这样的事情在AngularDart的最佳方式？

What's the best way to do something like this in AngularDart?

推荐答案

大问题！为了完成这个任务，你会注入 NgModel 指令到 myAwesomeComponent 。然后，你就可以获取和设置模式通过 NgModel.modelValue 。

Great question! To accomplish this task, you would inject the NgModel directive into myAwesomeComponent. Then you'll be able to get and set the model through NgModel.modelValue.

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

  ...
}

通过添加 NG-模型属性为你的元素，角创建 NgModel 指令。注入系统会给你 NgModel 为您的特定元素。

By adding an ng-model attribute to your element, Angular creates a NgModel directive. The injection system will give you the NgModel for your particular element.

看看如何等NgModel指令编写，如的 InputCheckboxDirective

Take a look at how other NgModel directives are written, such as InputCheckboxDirective

这篇关于AngularDart组件和模型绑定的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！