У меня есть следующий, очень упрощенный фрагмент:
c.then(function(data){
vm.checkedOut = data;
});
Он либо вернет запись, либо не будет. В любом случае, обещание возвращает объект - оно просто не может содержать никаких данных записи.
Все идет нормально. Здесь мой вопрос: как я могу обнаружить безошибочные ответы в моих представлениях?
Я делал это:
<div ng-if="vm.checkedOut.loaneeName !== undefined">
checked out!
</div>
loaneeName
является свойством записи, и оно не будет определено, если запись не будет возвращена. Вид неряшливый, но он работает.
Однако именно так я показал противоположное сообщение:
<div ng-if="vm.checkedOut.loaneeName === undefined">
not checked out!
</div>
Поскольку vm.checkedOut.loaneeName
всегда будет неопределенным, когда страница сначала загружается (и ждет ответов от API), "не проверено!" появляется сообщение, по крайней мере на какое-то время, что может быть очень плохо, если скорость соединения достаточно медленная.
Чтобы устранить эту проблему, я сделал следующее:
c.then(function(data){
vm.checkedOut = data;
if(vm.checkedOut.loaneeName === undefined){
vm.forRealsCheckedOut = true;
}
else {
vm.forRealsCheckedOut = false;
}
});
А потом:
<div ng-if="vm.forRealsCheckedOut === false">
not checked out!
</div>
...
Это работает, но это также поражает меня как небольшое грубое обходное решение для того, что я предполагаю, должно быть общей проблемой.
Я не первый человек, задающий такой вопрос, но у меня нет массива, и другие ответы не очень помогают.
Есть ли способ лучше?
Основой вашей проблемы является то, что если соединение происходит медленно, то "не проверено!" появится сообщение, пока данные не будут загружены. Вам необходимо определить, когда данные загружены. Вы можете это сделать, установив опцию vm.checkedOut или нет:
<div ng-if="vm.checkedOut !== undefined && vm.checkedOut.loaneeName === undefined">
not checked out!
</div>
Только если vm.checkedOut
определен и определено vm.checkedOut.loaneeName
, вы увидите сообщение "не проверено".
Или вы можете добавить переменную флага в вашу .then()
функцию, которая будет сигнализировать операторам ng-if
что данные были загружены, и они могут начать проверку загруженных значений:
$scope.dataLoaded = false;
c.then(function(data){
vm.checkedOut = data;
$scope.dataLoaded = true;
});
<div ng-if="dataLoaded && vm.checkedOut.loaneeName === undefined">
not checked out!
</div>
vm.forRealsCheckedOut = (vm.checkedOut.loaneeName === undefined);
иng-if="!vm.forRealsCheckedOut"
, но в остальном кажется, что вы хотите.