所以我想看看一系列输入是否有数据,如果有,则将其输出到其他地方。我已将 ng-model 应用于具有这些输入的 div,但没有得到我想要的结果。
我的输入代码:
<div class="benefits" ng-model="benefits">
<input type="text" class="form-control" ng-model="benefit1" placeholder="benefit 1" style="font-size:18px; margin-bottom: 25px;">
<input type="text" class="form-control" ng-model="benefit2" placeholder="benefit 2" style="font-size:18px; margin-bottom: 25px;">
<input type="text" class="form-control" ng-model="benefit3" placeholder="benefit 3" style="font-size:18px; margin-bottom: 25px;">
<input type="text" class="form-control" ng-model="benefit4" placeholder="benefit 4" style="font-size:18px; margin-bottom: 25px;">
<input type="text" class="form-control" ng-model="benefit5" placeholder="benefit 5" style="font-size:18px; margin-bottom: 25px;">
</div>
我的输出(无法正常工作:
<ul class="outputText" ng-show="benefits != null">Perceived benefits:
<li>{{ (benefit1 != null) ? benefit1 : '[describe benefit 1]' }}</li>
<li>{{ (benefit2 != null) ? benefit2 : '[describe benefit 2]' }}</li>
<li>{{ (benefit3 != null) ? benefit3 : '[describe benefit 3]' }}</li>
<li>{{ (benefit4 != null) ? benefit4 : '[describe benefit 4]' }}</li>
<li>{{ (benefit5 != null) ? benefit5 : '[describe benefit 5]' }}</li>
</ul>
如果在 div 上使用 ng-model 不是可行的方法,那么我如何设置 Benefit1 到 Benefit5 的范围以便输出能够简单地显示某些内容?
我确定这很简单,我只是没有看到?
非常感谢。
最佳答案
尝试使用<form>
并使用 $dirty
命名表单的属性。
angular.module("MyApp", [])
.controller("MyController", function() {});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="MyApp">
<div ng-controller="MyController">
<div class="benefits">
<form name="benefits">
<input type="text" class="form-control" ng-model="benefit1" placeholder="benefit 1" style="font-size:18px; margin-bottom: 25px;">
<input type="text" class="form-control" ng-model="benefit2" placeholder="benefit 2" style="font-size:18px; margin-bottom: 25px;">
<input type="text" class="form-control" ng-model="benefit3" placeholder="benefit 3" style="font-size:18px; margin-bottom: 25px;">
<input type="text" class="form-control" ng-model="benefit4" placeholder="benefit 4" style="font-size:18px; margin-bottom: 25px;">
<input type="text" class="form-control" ng-model="benefit5" placeholder="benefit 5" style="font-size:18px; margin-bottom: 25px;">
</form>
</div>
<ul class="outputText" ng-show="benefits.$dirty">Perceived benefits:
<li>{{ (benefit1) ? benefit1 : '[describe benefit 1]' }}</li>
<li>{{ (benefit2) ? benefit2 : '[describe benefit 2]' }}</li>
<li>{{ (benefit3) ? benefit3 : '[describe benefit 3]' }}</li>
<li>{{ (benefit4) ? benefit4 : '[describe benefit 4]' }}</li>
<li>{{ (benefit5) ? benefit5 : '[describe benefit 5]' }}</li>
</ul>
</div>
</div>
关于javascript - 检查任何 Angular 输入是否有输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40853860/