ฉันรู้ด้วย AngularJs และการใช้ ngView
ตำแหน่งการเลื่อนจะยังคงอยู่เมื่อนำทางกลับไปและไปข้างหน้าระหว่างมุมมองที่ต่างกัน ตอนนี้ฉันได้ใช้คำสั่งวัสดุเชิงมุม md-toolbar
และ md-content
ในมุมมองของฉันแล้ว แต่มันไม่คงตำแหน่งการเลื่อนไว้
มีวิธีแก้ไขใดที่จะรักษาตำแหน่งการเลื่อนของ md-content
ระหว่างมุมมองที่แตกต่างกันภายใน ngView
หรือไม่
โค้ดด้านล่างนี้จะทำให้เกิดปัญหาขึ้นอีกครั้ง และนี่คือตัวอย่างการสาธิต: demo
ดัชนี.html:
<body layout="row" ng-app="scrollPostion">
<div flex layout="column" layout-fill ng-view> </div>
<md-sidenav md-is-locked-open="true" class="md-whiteframe-z2">
<md-list>
<md-list-item>
<a href="/th#/page1">page1</a>
</md-list-item>
<md-list-item>
<a href="/th#/page2">page2</a>
</md-list-item>
</md-list>
</md-sidenav>
<script type="text/javascript">
angular
.module('scrollPostion', ['ngRoute', 'ngMaterial'])
.config(['$routeProvider', function ($routeProvider) {
$routeProvider.
when('/', {
templateUrl: 'page1.html',
}).
when('/page1', {
templateUrl: 'page1.html',
}).
when('/page2', {
templateUrl: 'page2.html',
}).
otherwise({ redirectTo: '/' })
}])
</script>
</body>
ดู 1 (หน้า 1):
<md-toolbar layout="row" class="md-toolbar-tools">
<h1>Page1</h1>
</md-toolbar>
<md-content flex id="content">
<div>
<p>long text1</p>
</div>
</md-content>
ดู 2 (หน้า 2):
<md-toolbar layout="row" class="md-toolbar-tools">
<h1>Page2</h1>
</md-toolbar>
<md-content flex id="content">
<div>
<p>long text2</p>
</div>
</md-content>
ฉันรู้ว่าปัญหาเกิดขึ้นจากคำสั่ง md-content
เพราะเมื่อฉันแทนที่ด้วย div
การรักษาตำแหน่งการเลื่อนไว้จะได้ผล แต่ฉันต้องการ md-toolbar
และ md-content
ภายในมุมมองของฉัน