Ответ 1
Причина, по которой вы должны использовать абстрактное состояние, состоит в том, чтобы сохранить ваше определение сухим, когда у вас есть часть вашего навигационного текста. Например, скажем, что у вас была схема URL-адресов, например:
/home/index
/home/contact
Однако по какой-либо причине в вашем дизайне этот URL-адрес недействителен (т.е. нет цели для страницы):
/home
Теперь вы можете просто создать два состояния для этой ситуации с полными URL-адресами, однако тогда вы будете писать /home/ дважды, а описание немного запутаннее. Лучшей идеей является создание родительского абстрактного родителя, из которого два других состояния являются дочерними (для ui-router docs):
$stateProvider
.state('parent', {
url: '/home',
abstract: true,
template: '<ui-view/>'
})
.state('parent.index', {
url: '/index',
templateUrl: 'index.html'
})
.state('parent.contact', {
url: '/contact',
templateUrl: 'contact.html'
})
Просто обратите внимание, что внутри родительского состояния мы назначаем шаблон, единственным дочерним элементом которого является ui-view. Это гарантирует, что дети будут обработаны (и может быть, почему ваши не отображаются).
Иногда вы можете заметить использование абстрактного состояния с пустым URL-адресом. Лучше всего использовать эту настройку, когда вам нужен родительский resolve. Например, для подмножества ваших состояний могут потребоваться определенные данные сервера. Поэтому вместо того, чтобы помещать одну и ту же функцию разрешения в каждое из ваших состояний, вы можете создать пустой родительский URL-адрес с желаемым решением. Это также может быть полезно, если вы хотите, чтобы иерархические контроллеры, в которых родитель не использовал для представления (не знаете, зачем вам это нужно, но это правдоподобно).