javascript - 如何在没有双向绑定(bind)的情况下将 ngModel 传递给 AngularJS 组件？

Question

我有custom input as AngularJS 1.5 component使用单向数据绑定(bind)和 ngModel 作为双向数据绑定(bind):

return {
     bindings: {
       form: "<",
       fieldName: "@",
       minLength: "@",
       maxLength: "@",
       isRequired: "@",
       errors: "<", 
       value: "=ngModel"
     },
     templateUrl: "actTextField.html",
     controller: ActTextFieldController,
   }

在提供的 Plunk 中的文件 actTextField.js 中。我要关注A new Angular 1.x ES2015 styleguide, the path to Angular 2托德写道:

We no longer should utilise two-way data-binding through '=' syntax for bindings

Use one-way databinding '<' and functions '&'

因此，ngModel 的 2-way 数据绑定(bind)可能不是一个好的选择，它应该是 1-way。另一方面，我想让组件尽可能简单——例如，没有 on-change 回调。它应该接近原生 input 和 ngModel 指令。是否可以在没有双向数据绑定(bind)的情况下将 ngModel 传递给组件，同时能够从组件更改其值，以避免(例如)额外的回调？预先感谢您的每一个回答。

Answer 1

如果您打算使用 Angular 组件，请尝试明智地使用一种绑定(bind)方式。在他的 View 模型中托管模型的上层父级应该是唯一能够修改它的父级。如果你想让子组件修改模型，你需要这样传递一个函数:

bindings: {
   updateUsername : '&', // Function
   user : '<'            // Model
}

他们这样做是为了简化 Angular 概念并使用指令减少页面上的事件数量。