Zacząłem grać z AngularJS i mam problem z routingiem do zagnieżdżonych podwidoków.Jak przekierować do subviews z AngularJS?
Moja witryna ma podstawowy układ dwie kolumny tak:
[Main 1] [Main 2] [Main 3]
--------------------------------------
A | Content for A goes into this frame.
B |
C |
D |
E |
linki menu boczne (a, b, c, d, e) będzie dynamicznie generowanych podczas nawigacji na stronie poprzez główną menu (główne 1, główne 2, główne 3).
Tj., Nawigacja do łącza głównego1 spowoduje wysłanie żądania do /main1
, które zwróci tablicę połączeń JSON.
Gdy użytkownik kliknie jedno z tych linków, spowoduje wysłanie żądania do /main1/a
i załadowanie danych do ramki zawartości.
Sposób Jestem obecnie robi to jest:
index.html:
<body>
<a href="/main1">Main 1</a>
<div ng-view></div>
</body>
app.js:
angular.module('test', [
'test.controllers'
])
.config([
'$routeProvider',
function($routeProvider)
{
$routeProvider
.when('/main1', {
templateUrl: '/partials/main1.html',
controller: 'Main1Ctrl'
})
.when('/main1/:id', {
templateUrl: '/partials/main1.html',
controller: 'Main1Ctrl'
})
}
]);
i to, gdzie mam oblepiony. Moja Main1Ctrl
kontroler aktualnie wygląda tak:
angular.module('test.controllers', [])
.controller('Main1Ctrl', [
'$scope',
'$routeParams',
'Data',
function($scope, $routeParams, Data)
{
$scope.submenu = Data.query();
}
]);
Problemy mam jest jak przypisać $scope.content
.
Jeśli w adresie URL nie ma podanego identyfikatora, muszę poczekać, aż podmenu wyrenderuje się, zanim będę mógł pobrać pierwszy identyfikator z listy (jeśli nie jest żądana zawartość, domyślnie zostanie wyświetlone pierwsze podmenu pozycja).
Jeśli użytkownik określi ID w adresie URL, chcę, aby żądania /main1
i /main1/:id
wystrzeliły równolegle. Użytkownik nie musi czekać na załadowanie menu przed wyświetleniem ich zawartości.
Czy to dobry sposób na obsługę tego typu układu?
możliwe duplikat [angularjs - kompleks zagnieżdżanie podszablonów i szablonów] (http://stackoverflow.com/questions/12863663/angularjs-complex-nesting-of-partials-and-templates) –