2014-12-13 67 views
0

我有以下的HTML和控制器。出于某种原因,标记为<p>Application Shell...的行完全不呈现url。这条线在任何命名视图之外,并且我期望它显示出来,而不管任何视图。使用ui-router视图时可以显示内容吗?

我在想我是否错误地使用了ui-router。当使用视图时,页面上是否还有其他内容?这是因为ionicFramework还是这种行为本地角/ UI路由器?我会感谢你的帮助。

我有2个“视图” - 搜索,应该在状态搜索时填充;以及应该填充的nav +细节的组合。

<body ng-app="myapp"> 
    <ion-nav-view> 
    </ion-nav-view> 
</body> 

--- shell.html --------- 

<div> 
    <ion-header-bar class="logo-bar"> 
     some header 
    </ion-header-bar> 
    <div style="background: pink"> 
     <p style="position: absolute; top: 146px;"> {{name}}, Application Shell, has 2 peer subviews</p> 
     <ion-nav-view name="searchContent" style="position: absolute; top: 44px;">coming soon... search</ion-nav-view> 
     <ion-nav-view name="navContent" style="position: absolute; top: 88px;">coming soon... nav</ion-nav-view> 
     <ion-nav-view name="detailContent" style="position: absolute; top: 126px;">coming soon... detail</ion-nav-view> 
    </div> 
    <div class="bar bar-footer bar-balanced"> 
     <div class="title">Footer</div> 
    </div> 
</div> 

----- nav.html ---------- 

<div style="background: yellow"> 
    <p>nav content is in yellow</p> 
</div> 

----- detail.html ------ 

<div style="background: orange"> 
    <p>detail content is in orange</p> 
</div> 

----- router (states) --- 

function RouterConfig($stateProvider, $urlRouterProvider) { 
     $stateProvider 
      .state('root', { 
       abstract: true, 
       templateUrl: "templates/shell.html" 
      }) 
      .state('root.home', { 
       url: "/", 
       views: { 
        'navContent': { templateUrl: "templates/nav.html" }, 
        'detailContent': { templateUrl: "templates/detail.html" } 
       } 
      }) 
      .state('root.search', { 
       url: "/search", 
       views: { 
        'searchContent': { templateUrl: "templates/search.html" } 
       } 
      }); 
     $urlRouterProvider.otherwise('/'); 
} // RouterConfig() 

回答

0

此行为是AngularJS路由的一部分。但是,如果您希望某些静态内容成为您使用的一个或多个视图的一部分,则始终可以使用ngInclude指令来加载某些静态内容。

例如,

<div class="slide-animate" ng-include="yourStaticFile.html"></div> 

更多细节可以发现here

+0

我的坏,我已经由“静态”的东西,是不是在一个特定视图的意思。 – Dinesh 2014-12-14 18:29:24

+0

你能否详细说明你的要求,你究竟在做什么? – 2014-12-15 03:59:36

+0

谢谢。我正在使用状态和视图重做我的Web应用程序。所以我有一个可以容纳多个不同视图的页面框架。 (有一个视图层次结构)。但是在使用离子时我很难看到骨架内容 - 在上面的例子中,“p1”是离子隐藏它的。它在dom中,我可以在改变颜色(到<> background)和z-index(到> 1)后看到它。我不知道是否这是一个错误或功能。 – Dinesh 2014-12-15 06:51:32

相关问题