Ionic和angularjs嵌套步骤应用程序

Question

我只是在学习angularjs和离子框架，我复制了一个演示并尝试进行更改但不确定为什么它不起作用。 我无法看到＆＃34;发言者的个人资料详情＆＃34;页。

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

这是代码笔演示

Codepen demo

Answer 1

我发现有3件事情导致这种情况无效：

1. speakersinfo模板缺少离子视图和离子内容。

确保它是这样开始的：

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

1. 控制器名称不匹配 - 您将状态提供程序中的控制器引用为speakerInfo（扬声器末尾没有's'），但将控制器声明为speakersinfo（使用's'开启发言者结束）。

确保名称匹配（您决定的方式）。

1. 您尝试使用网址eventmenu.speakers.speakersinfo访问状态#/event/speakersinfo，但了解嵌套状态如何与angular-ui / ui-router一起使用非常重要 - 状态声明中的网址为附加到其继承状态。因此，此处eventmenu.speakers.speakersinfo的子状态为eventmenu.speakers，因此网址必须为#/event/speakers/speakersinfo。 或者您可以将州名更改为eventmenu.speakersinfo - 我试过这个并且它对我有用。

我个人认为最好使用ui-sref属性而不是href url;这样你就可以使用声明的状态名称而且没有混淆。

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