我有一个输入
<input type="text" ng-model="choice.text">
choice.text
在对象选择中创建一个新的文本属性。这使我可以将输入的内容发送到其他页面。尽管此功能有效,但我还想添加另一个功能,其中在页面上实时显示和更新输入的内容。有些效果。
不幸的是,ng-model
已经设置为choice.text
。有没有办法将两个值设置为一个ng-model
?也许看起来像这样:
<input type="text" ng-model="choice.text name"></p>
<p ng-bind="name"></p>
如果没有,是否有其他方法可以实现此效果?
编辑:对于那些想知道的人,当我尝试<p ng-bind="choice.text"></p>
时,它由于某种原因无法使用。
编辑2:为了问题,我简化了代码。这是实际的代码以获取更多详细信息:
<div class ="ask-container">
<div ng-switch="cbstate">
<div ng-switch-when="not-pressed">
<h1>Choose between... </h1> <!-- I would like to add the dynamic element here -->
</div>
<div ng-switch-when="pressed">
<h1>Hi</h1>
</div>
</div>
<form role="form" ng-submit="submitChoice()">
<div class="input" ng-repeat="choice in poll.options">
<input type="text" ng-model="choice.text" placeholder="Choice {{$index+1}}"><br>
</div>
<button class="add" type="button" ng-click="addChoice()">+</button>
<button class="create" type="submit">Create</button>
</form>
</div>
编辑3:相同的代码,但使用ng-bind:
<div class ="ask-container">
<div ng-switch="cbstate">
<div ng-switch-when="not-pressed">
<h1>Choose between... </h1>
</div>
<div ng-switch-when="pressed">
<h1>Hi</h1>
</div>
</div>
<form role="form" ng-submit="submitChoice()">
<div class="input" ng-repeat="choice in poll.options">
<input type="text" ng-model="choice.text" ng-change="temp=choice.text" placeholder="Choice {{$index+1}}"><br>
</div>
<button class="add" type="button" ng-click="addChoice()">+</button>
<button class="create" type="submit">Create</button>
</form>
<p ng-bind="temp"></p>
<p ng-bind="choice.text"></p>
</div>
注意:有人说NG重复可能会弄乱我的范围。也许在尝试解决我的问题时要记住这一点。
目前,只有
list[0]
。最终,我希望他们所有人都出现在列表中,但我可以自己做。现在,我只希望第一个输入显示在绑定中。
让列表的第一个显示在绑定中:
<div class="input" ng-repeat="choice in poll.options">
<input type="text" ng-model="choice.text" placeholder="Choice {{$index+1}}" />
<br>
</div>
<p ng-bind="poll.options[0].text"></p>
ng-repeat
中的每个<div>
都有其自己的子范围,其中choice
属性设置为poll.options[0]
,poll.options[1]
,poll.options[2]
等。只需在父范围内使用这些值。
这是不可接受的吗?
<input type="text" ng-model="choice.text"></p>
<p ng-bind="choice.text"></p>
使用 ng-change 更新其他模型
<input type="text"
ng-model="choice.text"
ng-change="temp=choice.text"/>
现在进行测试,使用:
<p ng-bind="temp"></p>
<p ng-bind="choice.text"></p>