如何在ng-model名称中添加动态文本

时间:2019-02-19 05:31:37

标签: html angularjs ngmodel

是否可以在ng-model名称中添加动态文本?

数据js

self.Map = [{ Id: 0, Name: 'Map1' }, { Id: 1, Name: 'Map2' }, { Id: 2, Name: 'Map3' }]

html

<div ng-repeat="option in mainCtrl.Map">
    <div style="text-align:left;" class="col-md-6">
        {{option.Name}} Map
    </div>
    <div style="text-align:right;" class="col-md-6">
        <input type="text" id="Is{{option.Name}}" name="Is{{option.Name}}" ng-model="mainCtrl.Is{{option.Name}}"/>
    </div>
</div>

所需的输出

ng-model="mainCtrl.IsMap1"

2 个答案:

答案 0 :(得分:1)

请参阅https://www.w3schools.com/js/js_objects.asp,您可以通过以下两种方式访问​​对象:

objectName.propertyName

objectName["propertyName"]

您可以尝试以下方式,以便angularJs可以绑定所需的值:

<input type="text" id="Is{{option.Name}}" name="Is{{option.Name}}" ng-model="mainCtrl['Is'+option.Name]"/

答案 1 :(得分:0)

您是否尝试过将虚拟字段添加到HTML输入标签中

<div ng-repeat="option in mainCtrl.Map">
    <div style="text-align:left;" class="col-md-6">
        {{option.Name}} Map
    </div>
    <div style="text-align:right;" class="col-md-6">
        <input type="text" id="Is{{option.Name}}" name="Is{{option.Name}}" ng-model="mainCtrl[this.getAttribute('dummyfield')]" dummyfield="{{option.Name}}Role" />
    </div>
</div>