是否可以在指令(ng-model
)中使用NgModelController
而不将其绑定到<input>
标记,该标记是替换指令标记的模板标记集?
**
编辑 - 这是一个具有所需功能的fiddle,但span
包装模板
如果我被授予了一个愿望,我希望定义一个这样的指令:
<multi-component-zip ng-model='address.zipCode' size="10"/>
其中multi-component-zip
指令定义为属性:
template: '<input ng-model="collapsedZip" ng-pattern="/^[0-9]{5}(-[0-9]{4})?$/" type="text" />',
replace: true,
require: 'ngModel'
此处的模板ng-model
将与指令本身分开处理。
我想在指令中使用collapsedZip
来修改address.zipCode
的值,其类似于:{base: '90210', plusFour: '1234'}
来自NgModelController
。
但是,当然,实际上来自父级的ng-model被应用于<input>
所以我得到一个错误:
Multiple directives [ngModel, ngModel] asking for 'ngModel' controller on: <input ng-model="address.zipCode collapsedZip" ... >
也许另一种方法是避免对collapsedZip
使用ng-model,而是在输入元素上直接进行DOM操作以读取/显示用户的输入。
这很好,除了ng-model
属性仍然从父标记继承而且违背了指令的目的,因为它绑定到<input>
。
那么为什么不将template
<input>
包含在另一个元素中,例如<span>
?这会将两个ng-model
分开。好吧,应该继承其他<input>
属性,例如size=10
。
而不是ng-model
将数据绑定到指令我可以使用自定义属性并使用监视表达式或其他方法将address.zipCode
与collapsedZip
同步。这样可行。但是,如果我可以使用ng-model
,那么使用我为验证编写的其他指令会让生活变得更轻松。