Ionic 和 angularjs 嵌套步骤应用

Question

我正在学习 angularjs 和离子框架，我复制了其中一个演示并尝试进行更改，但不确定为什么它不起作用。我无法看到 "speakers profile details" 页面。

- Speakers
--- Speakers lists
----- Speakers profile details
- Schedule
- venue
- sponsors

这里是码笔演示

Answer 1

我发现有 3 个原因导致此问题不起作用：

确保它像这样开始：

<script id="templates/speakersinfo.html" type="text/ng-template">
<ion-view view-title="Speakers Info">
    <ion-content>

控制器名称不匹配 - 您在状态提供程序中将控制器引用为 speakerInfo（扬声器末尾没有 's'）但将控制器声明为 speakersinfo（有's' 在演讲者的结尾）。

确保名称匹配（由您决定）。

您尝试使用 url #/event/speakersinfo 访问状态 eventmenu.speakers.speakersinfo 但了解嵌套状态如何与 angular-ui/ui-router - url 一起工作很重要] 在状态声明中附加到其继承状态。所以这里 eventmenu.speakers.speakersinfo 是 eventmenu.speakers 的子状态，所以 url 必须是 #/event/speakers/speakersinfo。或者您可以将州名称更改为 eventmenu.speakersinfo - 我试过了，它对我有用。

我个人认为最好使用 ui-sref 属性而不是 href url;这样你就可以使用声明的州名，不会混淆。

还要提一下，您已经为与会者重复了模板 <script id="templates/attendees.html" type="text/ng-template">

Ionic and angularjs nested steps app