我正在与角度ui路由器挣扎。
它正确地渲染了一个带有ng-repeat表的视图,但是没有使用ng-repeat的详细视图。
模板加载,DOM呈现并且ng-repeat踢...内容显示但我无法向下滚动以查看整个内容
<ui-view></ui-view>
$stateProvider
.state('tickets', {
url: '/tickets',
templateUrl: '/assets/html/tickets.html',
controller: 'ticketController'
})
.state('dashboard', {
url: '/',
templateUrl: '/assets/html/dashboard.html',
controller: 'dashboardController'
})
.state('ticketDetail', {
url: '/tickets/:id',
templateUrl: '/assets/html/ticketDetail.html',
controller: 'ticketDetailController'
});
$urlRouterProvider.otherwise('dashboard');
状态票据加载了所提到的票证列表,状态ticketDetail加载票证的详细视图,如果从后端加载内容,我不能再滚动...
当使用角度ui-router时,非常令人失望,这就出现了!
我会很高兴找到一些解决方案!
我要加载的模板:
<div class="container" style="top: 75px;">
<div class="columns">
<div class="column col-2"></div>
<div class="column col-8">
<ul class="breadcrumb">
<li class="breadcrumb-item">
<a ui-sref="tickets">
Tickets
</a>
</li>
<li class="breadcrumb-item">
<a href="#">
{{thisTicket.id}}
</a>
</li>
</ul>
<div class="divider"></div>
<div ng-if="isLoading == true" class="loading"></div>
<div ng-if="isLoading == false">
<div class="columns">
<div class="column"><h6>Titel:</h6>{{thisTicket.title}}</div>
<div class="column"><h6>Priority:</h6>{{thisTicket.priority}}</div>
<div class="column"><h6>Status:</h6><span class="label label-primary">{{thisTicket.status}}</span></div>
<div class="column"><h6>Type:</h6>{{thisTicket.type}}</div>
<div class="column"><h6>Assignee:</h6>{{thisTicket.assignee}}</div>
<div class="column"><h6>Owner:</h6>{{thisTicket.owner}}</div>
</div>
<br>
</div>
<div class="divider"></div>
<ul class="tab tab-block">
<li class="tab-item active">
<a >
Conversation
</a>
</li>
<li class="tab-item">
<a >
Attachements
</a>
</li>
<li class="tab-item">
<a >
Images
</a>
</li>
<li class="tab-item">
<a >
Connect
</a>
</li>
</ul>
<div scroll-glue>
<!-- Content here will be "scroll-glued". -->
<blockquote ng-repeat="comment in thisTicket.comments">
<p ng-bind-html="comment.text"></p>
<cite>
<div class="chip-sm">
<img src="http://vignette1.wikia.nocookie.net/callofduty/images/c/c5/GHOSTS.jpg/revision/latest?cb=20130501101925" class="avatar" />
<span class="chip-name">{{comment.owner}} at {{comment.createDate}}</span>
</div>
</cite>
</blockquote>
</div>
<!-- form textarea control -->
<div class="form-group">
<label class="form-label" for="input-example-3">Message</label>
<text-angular ng-model="comment" style="" ta-toolbar="[['bold','italics','underline','strikeThrough'],['pre','quote'],['ul','ol']]"></text-angular>
<br>
<button class="btn btn-block" ng-click="addComment(comment)">Absenden</button>
</div>
</div>
<div class="column col-2"></div>
</div>
</div>