Saya menggunakan perutean AngularUI dan saya ingin melakukan ng-class="{active: current.state}"
tetapi saya tidak yakin bagaimana cara mendeteksi keadaan saat ini dalam arahan seperti ini.
sumber
Saya menggunakan perutean AngularUI dan saya ingin melakukan ng-class="{active: current.state}"
tetapi saya tidak yakin bagaimana cara mendeteksi keadaan saat ini dalam arahan seperti ini.
Anda juga dapat menggunakan direktif ui-sref-active :
<ul>
<li ui-sref-active="active" class="item">
<a href ui-sref="app.user({user: 'bilbobaggins'})">@bilbobaggins</a>
</li>
<!-- ... -->
</ul>
Atau filter:
"stateName" | isState
&"stateName" | includedByState
Memperbarui:
Jawaban ini untuk rilis Ui-Router yang jauh lebih tua. Untuk rilis yang lebih baru (0.2.5+), silakan gunakan direktif helper ui-sref-active
. Detailnya di sini .
Jawaban Asli:
Sertakan layanan $ state di pengontrol Anda. Anda dapat menetapkan layanan ini ke properti di lingkup Anda.
Sebuah contoh:
$scope.$state = $state;
Kemudian untuk mendapatkan status saat ini di template Anda:
$state.current.name
Untuk memeriksa apakah suatu keadaan saat ini aktif:
$state.includes('stateName');
Metode ini mengembalikan nilai true jika status disertakan, meskipun itu bagian dari status bertingkat. Jika Anda berada di status bersarang user.details
, dan Anda memeriksanya $state.includes('user')
, itu akan mengembalikan nilai true.
Dalam contoh kelas Anda, Anda akan melakukan sesuatu seperti ini:
ng-class="{active: $state.includes('stateName')}"
Jika Anda menggunakan ui-router, coba $ state.is ();
Anda dapat menggunakannya seperti ini:
$state.is('stateName');
Sesuai dokumentasi:
sumber
Penggunaan arahan ui-sref-active yang berhasil untuk saya adalah:
seperti yang ditemukan di sini di bawah komentar berlabel "tgrant59 berkomentar pada 31 Mei 2016".
Saya menggunakan angular-ui-router v0.3.1.
sumber
Lihat angular-ui, khususnya, pemeriksaan rute: http://angular-ui.github.io/ui-utils/
sumber