NG的高度显示为Ionic中的0

Question

更新：

使用ng-include高度为0。我在下面提供了一个完全简化的示例。我需要知道如何解决此问题并进行操作，以便页面说您好。

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

模板/Page30文件是

的位置

<p>Hello</p>

原始帖子：

我需要弄清楚如何在ng-switch中显示我的ng-include。目前，代码不起作用。两件事并未如预期的那样发生。外部按钮很小，包括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;