Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/ionic-framework/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Ionic framework 多条件离子标题栏';s重叠离子含量_Ionic Framework - Fatal编程技术网

Ionic framework 多条件离子标题栏';s重叠离子含量

Ionic framework 多条件离子标题栏';s重叠离子含量,ionic-framework,Ionic Framework,我在和头条搏斗 这段代码运行得非常好: <ion-pane> <ion-header-bar class="bar-balanced"> <h1 class="title">mytitle</h1> </ion-header-bar> <ion-view view-title=""> <ion-content> MyCo

我在和头条搏斗

这段代码运行得非常好:

   <ion-pane>
      <ion-header-bar class="bar-balanced">
        <h1 class="title">mytitle</h1>
      </ion-header-bar>
      <ion-view view-title="">
        <ion-content>
          MyContent
        </ion-content>
      </ion-view>
    </ion-pane>
手动设置
has header
类并不能解决问题。该类通过angular/ionic移除。 我做错了什么?应该可以设置不同的标题,不是吗?
提前感谢您的帮助。

ng show
更改为
ng,如果
有效:

(注:请全屏查看片段)
angular.module('ionicApp',['ionic']))
.controller('AppCtrl',函数($scope){
$scope.head=1;
$scope.change=函数(n){
$scope.head=n;
}
});

mytitle1
mytitle1
mytitle2
mytitle3
标题1
总目2
总目3

ng show/hide仅使用css隐藏它们,但它们仍然存在于dom中,这意味着您的视图有多个标题。ng if将从物理上删除任何不匹配的内容,这正是您想要的。您可以阅读css中display:none和visibility:hidden之间的区别,因为这正是这里的区别。
   <ion-pane>
      <ion-header-bar class="bar-balanced" ng-show="conditionA()">
        <h1 class="title">mytitle1</h1>
      </ion-header-bar>
      <ion-header-bar class="bar-balanced" ng-show="conditionB()">
        <h1 class="title">mytitle2</h1>
      </ion-header-bar>
      <ion-header-bar class="bar-balanced" ng-show="conditionC()">
        <h1 class="title">mytitle3</h1>
      </ion-header-bar>
      <ion-view view-title="">
        <ion-content>
          MyContent
        </ion-content>
      </ion-view>
    </ion-pane>