我正在设计一张类似facebook的明信片。当我用内容填充textarea时,卡片高度不会根据内容而改变。
我在md-content中插入了一个带有文本输入和textarea的表单。键入时我需要我的卡片根据textarea高度改变它的高度。
我的代码在这里:
<md-card flex class="post" ng-class="{sm: $mdMedia('sm'), md: $mdMedia('md'), lg: $mdMedia('lg')}">
<form name="postForm" role="form" method="POST">
<md-card-header class="row">
<md-card-avatar>
<img class="md-user-avatar" src="../assets/images/yeoman.png" />
</md-card-avatar>
<md-card-header-text>
<md-input-container class="md-block">
<label>Post Title</label>
<input ng-model="post.postTitle" data-ng-required="true">
</md-input-container>
</md-card-header-text>
</md-card-header>
<md-card-header class="row">
<md-card-avatar class="mr12">
<!-- <img class="md-user-avatar" src="../assets/images/yeoman.png" />-->
</md-card-avatar>
<md-card-header-text>
<md-input-container class="md-block">
<label>Post something</label>
<textarea ng-model="user.biography" columns="1" md-maxlength="150" rows="5"></textarea>
</md-input-container>
</md-card-header-text>
</md-card-header>
<md-card-content class="p0" flex>
<md-card-actions layout="row" layout-align="start center">
<div class="fileinput fileinput-new" data-provides="fileinput">
<md-button class="btn btn-default btn-file">
<label for="fileToUpload">
<i class="mdi mdi-cloud-upload mr10"></i>
</label><span class="fileinput-new">Upload</span><span class="fileinput-exists">Change</span>
<input type="file" file="" data-ng-model="file" name="...">
</md-button>
<span class="fileinput-filename"></span>
<a href="#" class="close fileinput-exists" data-dismiss="fileinput" style="float: none">×</a>
</div>
<md-card-icon-actions class="pull-right" layout-align="end center">
<button class="md-raised md-primary md-button md-ink-ripple pull-right" aria-label="toggle" type="button" data-ng-click="createPost()"><span class="ng-scope"><i class="mdi mdi-message-text mr10"></i>Post</span>
<div class="md-ripple-container"></div>
</button>
</md-card-icon-actions>
</md-card-actions>
</md-card-content>
</form>
</md-card>