【问题标题】:How to pass ngModel to AngularJS component without 2-way binding?如何在没有 2 路绑定的情况下将 ngModel 传递给 AngularJS 组件?
【发布时间】:2016-08-15 10:27:22
【问题描述】:

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

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 Todd 写道:

我们不再应该通过 '=' 语法使用双向数据绑定来进行绑定

使用单向数据绑定'

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

【问题讨论】:

    标签: javascript angularjs angularjs-controller angular-ngmodel angularjs-components


    【解决方案1】:

    如果您打算使用角度组件,请尝试明智地使用一种方式绑定。在他的视图模型中托管模型的上父母应该是唯一能够修改它的人。如果你想让子组件修改模型,你需要这样传递一个函数:

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

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

    【讨论】:

    • 看来真的不能没有回调。
    猜你喜欢
    • 2018-03-24
    • 2021-04-14
    • 2013-11-10
    • 2018-03-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-12-06
    • 1970-01-01
    相关资源
    最近更新 更多