Próbuję użyć funkcji ng-click w AngularJS, aby przełączyć widoki. Jak miałbym to zrobić z poniższym kodem?
index.html
<div ng-controller="Cntrl">
<div ng-click="someFunction()">
click me
<div>
<div>
controller.js
function Cntrl ($scope) {
$scope.someFunction = function(){
//code to change view?
}
}
javascript
angularjs
ngroute
Krawędź
źródło
źródło
<a href="https://stackoverflow.com/edit">Edit</a>
Angular upewni się, że kliknięcie nie spowoduje ponownego załadowania strony. To zachowanie można zmodyfikować, aby w razie potrzeby uruchamiało ponowne ładowanie.Podana odpowiedź jest absolutnie poprawna, ale chciałem rozszerzyć ją na przyszłych użytkowników, którzy mogą chcieć to zrobić nieco bardziej dynamicznie -
W widoku -
W kontrolerze -
Ta sama podstawowa koncepcja, co przyjęta odpowiedź, wystarczy dodać do niej trochę dynamicznej zawartości, aby nieco poprawić. Jeśli zaakceptowana odpowiedź chce ją dodać, usunę moją odpowiedź.
źródło
url
to w rzeczywistości pełny adres internetowy, w tym protokół (http: //) i wszystko. Jak sugeruje$location.path()
twoja zmienna, lepiej opisać ją jakopath
.Mam przykład działający.
Oto jak wygląda mój dokument:
Oto jak wygląda moje częściowe:
Oto jak wygląda mój Ctrl:
aplikacja jest moim modułem:
Mam nadzieję, że to jest pomocne!
źródło
Metoda zastosowana we wszystkich poprzednich odpowiedziach na to pytanie sugeruje zmianę adresu URL, co nie jest konieczne, i myślę, że czytelnicy powinni być świadomi alternatywnego rozwiązania. Używam interfejsu ui-routera i $ stateProvider do powiązania wartości stanu z szablonUrl, który wskazuje plik HTML dla twojego widoku. Następnie wystarczy wprowadzić do kontrolera stan $ i wywołać $ state.go („stan-wartość”), aby zaktualizować widok.
Jaka jest różnica między trasą kątową a angular-ui-routerem?
źródło
Są na to dwa sposoby:
Jeśli używasz interfejsu użytkownika lub
$stateProvider
wykonaj następujące czynności:jeśli używasz routera kątowego lub
$routeProvider
zrób to jako:źródło
Bez pełnej zmiany domyślnego środowiska routingu (# / ViewName) udało mi się wprowadzić niewielką modyfikację końcówki Cody i sprawiłem, że działała świetnie.
kontroler
widok
To, co przywiodło mnie do tego rozwiązania, to fakt, że kiedy próbowałem zintegrować widget Kendo Mobile UI ze środowiskiem kątowym, traciłem kontekst mojego kontrolera, a zachowanie regularnego tagu kotwicy również było porywane. Ponownie ustanowiłem swój kontekst z widżetu Kendo i potrzebowałem użyć metody do nawigacji ... to zadziałało.
Dzięki za poprzednie posty!
źródło
Mam nadzieję, że to ci pomoże
źródło
Ta mała funkcja dobrze mi służyła:
Nie potrzebujesz pełnej ścieżki, tylko widok, na który się przełączasz
źródło