我在循环中显示输入。对于每一个我想要附加3个跨度,这些跨度表示“需要”,“太短”,“太长”。我这样做了:
<form name="sellItem">
<div data-ng-repeat="n in langInput.values" style="margin-top: 100px; background: white; color: white">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 u-no-padding">
<label class="sell__label" for="auction_name_account_{{n.selected}}">Główna nazwa Twojej aukcji ({{n.selected }}):</label>
<div>
<input type="text"
id="auction_name_account_{{n.selected}}"
class="form-control"
name="auction_name_account[$index]"
data-ng-model="inputs.auction_name_account[$index]"
data-ng-minlength="10"
data-ng-maxlength="60"
required />
<span class="sell__input-text sell__input-text--big-input"
data-ng-show="sellItem.auction_name_account[$index].$error.required">Wymagane!</span>
<span class="sell__input-text sell__input-text--big-input"
data-ng-show="sellItem.auction_name_account[$index].$error.minlength">Za krótkie!</span>
<span class="sell__input-text sell__input-text--big-input"
data-ng-show="sellItem.auction_name_account[$index].$error.maxlength">Za długie!</span>
{{ inputs }}
</div>
</div>
</div>
</form>
但是跨度根本没有表现出来。我正在循环的值是:
$scope.langInput = {
values: [
{
id: "1",
selected: "pl"
},
{
id: "2",
selected: "eng"
}
],
我也在初学化数组
$scope.inputs = {
auction_name_account: []
};
确保ng-model是唯一的。
如何将验证范围附加到正确的输入?就像我说的跨度根本没有显示。
答案 0 :(得分:1)
name
的{{1}}属性需要使用插值<input>
:
{{ }}
<form name="sellItem">
<div data-ng-repeat="n in langInput.values" style="margin-top: 100px; background: white; color: white">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 u-no-padding">
<label class="sell__label" for="auction_name_account_{{n.selected}}">Główna nazwa Twojej aukcji ({{n.selected }}):</label>
<div>
<input type="text"
id="auction_name_account_{{n.selected}}"
class="form-control"
̶n̶a̶m̶e̶=̶"̶a̶u̶c̶t̶i̶o̶n̶_̶n̶a̶m̶e̶_̶a̶c̶c̶o̶u̶n̶t̶[̶$̶i̶n̶d̶e̶x̶]̶"̶
name="auction_name_account_{{$index}}"
data-ng-model="inputs.auction_name_account[$index]"
data-ng-minlength="10"
data-ng-maxlength="60"
required />
<span class="sell__input-text sell__input-text--big-input"
̶d̶a̶t̶a̶-̶n̶g̶-̶s̶h̶o̶w̶=̶"̶s̶e̶l̶l̶I̶t̶e̶m̶.̶a̶u̶c̶t̶i̶o̶n̶_̶n̶a̶m̶e̶_̶a̶c̶c̶o̶u̶n̶t̶[̶$̶i̶n̶d̶e̶x̶]̶.̶$̶e̶r̶r̶o̶r̶.̶r̶e̶q̶u̶i̶r̶e̶d̶"̶>̶W̶y̶m̶a̶g̶a̶n̶e̶!̶<̶/̶s̶p̶a̶n̶>̶
data-ng-show="sellItem['auction_name_account_'+$index].$error.required">Wymagane!</span>
<span class="sell__input-text sell__input-text--big-input"
̶d̶a̶t̶a̶-̶n̶g̶-̶s̶h̶o̶w̶=̶"̶s̶e̶l̶l̶I̶t̶e̶m̶.̶a̶u̶c̶t̶i̶o̶n̶_̶n̶a̶m̶e̶_̶a̶c̶c̶o̶u̶n̶t̶[̶$̶i̶n̶d̶e̶x̶]̶.̶$̶e̶r̶r̶o̶r̶.̶m̶i̶n̶l̶e̶n̶g̶t̶h̶"̶>̶Z̶a̶ ̶k̶r̶ó̶t̶k̶i̶e̶!̶<̶/̶s̶p̶a̶n̶>̶
data-ng-show="sellItem['auction_name_account_'+$index].$error.minlength">Za krótkie!</span>
<span class="sell__input-text sell__input-text--big-input"
̶d̶a̶t̶a̶-̶n̶g̶-̶s̶h̶o̶w̶=̶"̶s̶e̶l̶l̶I̶t̶e̶m̶.̶a̶u̶c̶t̶i̶o̶n̶_̶n̶a̶m̶e̶_̶a̶c̶c̶o̶u̶n̶t̶[̶$̶i̶n̶d̶e̶x̶]̶.$̶e̶r̶r̶o̶r̶.̶m̶a̶x̶l̶e̶n̶g̶t̶h̶"̶>̶Z̶a̶ ̶d̶ł̶u̶g̶i̶e̶!̶<̶/̶s̶p̶a̶n̶>̶
data-ng-show="sellItem['auction_name_account_'+$index].$error.maxlength">Za długie</span>
{{ inputs }}
</div>
</div>
</div>
</form>
指令采用Angular表达式而不插值。