Question

ion-nav-view指令的示例代码实际上并未显示其用法。所以我不确定如何使用它。以下是文档的链接：

http://ionicframework.com/docs/api/directive/ionNavView/

在 USAGE 标题下，它说：

在应用开始时，$ stateProvider将查看该网址，看它是否匹配   索引状态，然后尝试将home.html加载到

页面由给定的URL加载。一种创建模板的简单方法   在Angular中将它们直接放入HTML文件并使用    句法。所以这是一种方法   home.html进入我们的应用程序：

<script id="home" type="text/ng-template">

  <!-- The title of the ion-view will be shown on the navbar -->
  <ion-view view-title="Home">
    <ion-content ng-controller="HomeCtrl">
      <!-- The content of the page -->
      <a href="#/music">Go to music page!</a>
    </ion-content>
  </ion-view>

</script>

这样做很好，因为模板将以非常快的速度进行缓存加载，而不是必须从网络中获取它们。

我是否将所有内容嵌套在ion-nav-view指令中？我混淆的另一个原因是因为在一个离子模板中框架提供了我已经看到的离子导航视图打开和关闭它之间没有任何东西（下面的代码是直接从Ionic的模板之一复制和粘贴）：< / p>

 <body ng-app="myApp">

    <!--
          The nav bar that will be updated as we navigate between views.
        -->
        <ion-nav-bar class="bar-stable">
          <ion-nav-back-button>
          </ion-nav-back-button>
        </ion-nav-bar>
        <!--
          The views will be rendered in the <ion-nav-view> directive below
          Templates are in the /templates folder (but you could also
          have templates inline in this html file if you'd like).
        -->

        <ion-nav-view></ion-nav-view>

    </body>

Answer 1

此<ion-nav-view>的行为类似于占位符。你在templates文件夹下创建的其他html文件就在那里。例如，你有＆＃34; employees.html＆＃34;在您的模板文件夹中。所以＆＃34; employees.html＆＃34;的标记会看起来像这样：

<ion-view view-title="Employees">
<ion-content>
  <ion-list>
    <ion-item ng-repeat="item in items">
      Hello, {{item}}
    </ion-item>
  </ion-list>
</ion-content>
</ion-view>

以上是完整的html，它将位于＆＃34; employees.html＆＃34;。基本上这是将放在<ion-nav-view>标签内的html。

希望这会有所帮助。

这部分离子导航视图文档对我来说没有意义

1 个答案: