Fatal编程技术网
  • javascript/
  • Javascript angularjs在特定状态下隐藏ui视图

Javascript angularjs在特定状态下隐藏ui视图

javascript angularjs uiview

Javascript angularjs在特定状态下隐藏ui视图,javascript,angularjs,uiview,angular-ui,Javascript,Angularjs,Uiview,Angular Ui,我有该控制器的控制器和模板视图 ProductCtrl=>Products.html SomeCrtl=>Some.html FooCtrl=>Foo.html 我在主页上有一个用户界面视图 <html> <body> <a href="#/product"></a> <a href="#/some"></a> <a href="#/foo"></a>

我有该控制器的控制器和模板视图

  • ProductCtrl=>Products.html
  • SomeCrtl=>Some.html
  • FooCtrl=>Foo.html
我在主页上有一个用户界面视图

<html> 
   <body> 
     <a href="#/product"></a>
     <a href="#/some"></a>
     <a href="#/foo"></a>
     <div ui-view></div> 
       ....
应用程序启动时，我的最后一个视图出现在ui视图上。但是我希望ui视图应该是空的。单击链接时，应该查看该内容。

尝试使用HTML元素包装您的
ui视图
，并根据当前状态使用
ng hide
操作隐藏它

代码示例

<div ng-hide="$state.current.name === 'home'">
    <div ui-view></div>
</div>
完成@bookmarker提到的另一种方法：

<div ng-hide="$state.includes('home')">
    <div ui-view></div>
</div>



$state.includes（“…”）
可用于查看某个状态是否包含指定的状态，即检查子状态是否包含某个父状态。

您只需不将
/
url映射到某个状态即可。我已使用状态更新。我从url中删除了“/”，但链接不起作用。 
<div ng-hide="$state.includes('home')">
    <div ui-view></div>
</div>