javascript - `angular-ui-router` 是如何确定在哪里插入状态 View 的？

Question

我遵循了 the github page 上的示例angular-ui-router。该示例运行良好，但我对 ui-router 如何确定在何处插入部分状态 View 感到困惑。关于Dive Deeper页面，它说

When a state is activated, its templates are automatically inserted into the ui-view of its parent state's template. If it's a top-level state—which 'contacts' is because it has no parent state–then its parent template is index.html.

但是，在我遵循的示例中，我找不到任何指示状态之间父子关系的信息。例如，state1.list 的父级是什么？为什么？

非常感谢。

Answer 1

层次结构由点符号决定

来自 the docs, Nested States & Nested Views :

You can use dot syntax to infer your hierarchy to the $stateProvider. Below, contacts.list becomes a child of contacts.

$stateProvider
  .state('contacts', {})
  .state('contacts.list', {});

所以 state1.list 的父级是 state1 因为 ui-router 使用点符号来确定父子关系。