ng-if 在 length > 0 时正确出现,但在 length === 0 时不出现
ng-if appearing properly when length > 0, but not appearing when length === 0
我有一个非常简单的 ng-if,它基于数组的长度。如果长度大于零,则显示长度。如果它为零,则表示它是空的。它在长度大于零时显示,但在长度为零时不显示。有人看到我在这里失踪了吗?
这是我的 HTML(有问题的 ng-if 在第 5 行和第 9 行,但我想我会把周围的 HTML 放在那里以防万一那里有东西我' m 缺失):
<div class="employee-box" ng-repeat="employee in sigFigCtrl.companies[$index].employees">
<span class="glyphicon glyphicon-edit pull-right" ng-click="sigFigCtrl.toggleEmployeeEdit($index)"></span>
<span class="glyphicon glyphicon-remove pull-right" ng-click="sigFigCtrl.deletePerson(employee._id, $index, sigFigCtrl.companies[$parent.$index].employees)"></span>
<div ng-show="!sigFigCtrl.companies[$index].editEmployee">
<div ng-if="sigFigCtrl.companies[$index].employees.length > 0">
<p><b>Name:</b> {{employee.name}}</p>
<p><b>Email:</b> {{employee.email}}</p>
</div>
<div ng-if="sigFigCtrl.companies[$index].employees.length === 0">
empty array!
</div>
</div>
<div ng-show="sigFigCtrl.companies[$index].editEmployee">
<form name="editPersonForm" ng-submit="sigFigCtrl.editPerson(employee._id, $index)">
<div class="form-group">
<div class="col-md-12">
<input type="text" ng-model="sigFigCtrl.editPersonName" id="name" placeholder="Name of Employee" class="form-control" required></input>
</div>
</div> <div class="form-group">
<div class="col-md-12">
<input type="text" ng-model="sigFigCtrl.editPersonEmail" id="name" placeholder="Email of Employee" class="form-control" required></input>
</div>
<button>SUBMIT</button>
</form>
</div>
</div>
问题很简单。您正在 sigFigCtrl.companies[$index].employees
上重复。这意味着当没有元素时它永远不会 运行。把它想象成像 for each
或 for
这样的循环。如果没有元素,迭代将永远不会 运行。这就是为什么你永远不会真正到达你正在测试它是否有元素的内部 ngIf
的原因。它停在根部
我有一个非常简单的 ng-if,它基于数组的长度。如果长度大于零,则显示长度。如果它为零,则表示它是空的。它在长度大于零时显示,但在长度为零时不显示。有人看到我在这里失踪了吗?
这是我的 HTML(有问题的 ng-if 在第 5 行和第 9 行,但我想我会把周围的 HTML 放在那里以防万一那里有东西我' m 缺失):
<div class="employee-box" ng-repeat="employee in sigFigCtrl.companies[$index].employees">
<span class="glyphicon glyphicon-edit pull-right" ng-click="sigFigCtrl.toggleEmployeeEdit($index)"></span>
<span class="glyphicon glyphicon-remove pull-right" ng-click="sigFigCtrl.deletePerson(employee._id, $index, sigFigCtrl.companies[$parent.$index].employees)"></span>
<div ng-show="!sigFigCtrl.companies[$index].editEmployee">
<div ng-if="sigFigCtrl.companies[$index].employees.length > 0">
<p><b>Name:</b> {{employee.name}}</p>
<p><b>Email:</b> {{employee.email}}</p>
</div>
<div ng-if="sigFigCtrl.companies[$index].employees.length === 0">
empty array!
</div>
</div>
<div ng-show="sigFigCtrl.companies[$index].editEmployee">
<form name="editPersonForm" ng-submit="sigFigCtrl.editPerson(employee._id, $index)">
<div class="form-group">
<div class="col-md-12">
<input type="text" ng-model="sigFigCtrl.editPersonName" id="name" placeholder="Name of Employee" class="form-control" required></input>
</div>
</div> <div class="form-group">
<div class="col-md-12">
<input type="text" ng-model="sigFigCtrl.editPersonEmail" id="name" placeholder="Email of Employee" class="form-control" required></input>
</div>
<button>SUBMIT</button>
</form>
</div>
</div>
问题很简单。您正在 sigFigCtrl.companies[$index].employees
上重复。这意味着当没有元素时它永远不会 运行。把它想象成像 for each
或 for
这样的循环。如果没有元素,迭代将永远不会 运行。这就是为什么你永远不会真正到达你正在测试它是否有元素的内部 ngIf
的原因。它停在根部