Question

更新

使用ng-include高度为0.我在下面提供了一个完全简化的示例。我需要知道如何解决这个问题，并使页面显示为Hello。

＆＃13;

<ion-view title="Page">
	<ion-content padding="true" class="has-header">
            <div ng-include="'templates/page30'"></div>
	</ion-content>
</ion-view>

＆＃13;

＆＃13; 模板/ page30文件是

的位置

<p>Hello</p>

原帖：

我需要弄清楚如何让ng-include显示在ng-switch中。目前代码不起作用。有两件事没有按预期发生。外部按钮很小，并且包含ng的子表单没有显示为高度为0.请记住我使用的是Ionic，这意味着我无法访问*.height()。

注意：我只显示ng-switch的第1步，否则会过于笨重。

<ion-view title="Some Template" hide-nav-bar="true">
  <ion-content padding="true" class="has-header">
    <div ng-controller="someCtrl">
        <ng-switch on="step">
            <div ng-switch-when="1">
                <div height-bind height-value="containerHeight">
                    <ng-include src="'templates/somepage.html'"></ng-include>
                </div>
            </div>
        </ng-switch>
    </div>
  </ion-content>
</ion-view>

我已经构建了一个如下所示的指令：

llApp.directive('heightBind', function() {
  return {
    scope: {
      heightValue: '='
    },
    link: function($scope, $element) {
      $scope.$watch(function() {
        $scope.heightValue = $element.prop('offsetHeight');
      });
    }
  }
});

ng-include调用的模板如下：

<ion-view title="Services" hide-nav-bar="true">
  <ion-content padding="true" class="has-header">
    <div class="page-header">
      <h1>
        <span>Lawncare</span>Services</h1>
    </div>

    <ul class="list">
        <li class="item item-checkbox">
           Mow Lawn
           <label class="checkbox">
           <input type="checkbox">
           </label>
        </li>
        <li class="item item-checkbox">
           Trim Plants
           <label class="checkbox">
           <input type="checkbox">
           </label>
        </li>
    </ul>
  </ion-content>
</ion-view>

最后一件事。控制器someCtrl如下所示:(实际控制器参考丢失，因为我目前在离子创建器中工作）

function($scope, $stateParams) {

  // Set the step initially to 1 every time this controllwer is instantiated.  
  // Usually on ng-switch button update the
  // step value via the setStep function provided

  $scope.step = 1;

  $scope.setStep = function(step) {
    $scope.step = step;
  }

  $scope.containerHeight = 0;
}

我已经考虑过解决此问题的其他一些事情。我看过： http://stackoverflow.com/questions/25108780/height-of-container-with-ng-repeat-directive-is-zero

以及这个plunker： Plunker

Answer 1

您在控制器中将高度设置为0：

$ scope.containerHeight = 0;

ng-include height在离子中显示为0

更新

原帖：

1 个答案: