javascript - tablas - AngularJS, ¿qué hay de las rutas múltiples con diferentes plantillas pero el mismo controlador?

tablas dinamicas angular 4

Question

Estoy investigando si puedo tener lo que dice el título. Aquí está mi pensamiento.

Supongamos que tengo estas rutas:

 .when(''/'', {
templateUrl : ''partials/homepage.html'',
})
.when(''/test'', {
templateUrl : ''partials/test.html'',
})
.when(''/page/:pageID'', {
templateUrl : ''partials/page.html'',
})
.when(''/page/single/:pageID'', {
templateUrl : ''partials/page-single.html'',
})

Hasta ahora tuve la oportunidad de agregar la plantillaUrl y también los detalles del controlador en la ruta y todo estaba funcionando bien.

Ahora la aplicación ha cambiado y solo hay un controlador con toda la información necesaria y debe seguir siendo un controlador. Y las rutas serán algo así:

 .when(''/:templateName/:pageID'', {
controller: ''myCtrl''
})

¿Puedo establecer desde el controlador el ID de la plantilla obteniendo el parámetro templateName? Y si es así, ¿qué hay de la última ruta example / page / single /: pageID? ¿Cómo puedo saber que hay una segunda opción en ruta?

Puedo tomar el parámetro templateName y verlo cambiar con el método $ routeChangeSuccess, pero no puedo encontrar ninguna manera de establecer la plantilla sobre la marcha.

¿Algunas ideas?

Answer 1

Me gustaría mover su lógica singleton de su controlador a un servicio. Como no proporcionó muchos códigos a continuación, hay un ejemplo para darle una idea de cómo podría funcionar.

app.config(function($routeProvider) {
$routeProvider
.when(''/'', {
templateUrl: ''partials/homepage.html'',
controller: ''SingleController''
})
.when(''/test'', {
templateUrl: ''partials/test.html'',
controller: ''SingleController''
})
.when(''/page/:pageId'', {
templateUrl: ''partials/page.html'',
controller: ''SingleController''
});
});
app.provider(''appState'', function() {
this.$get = [function() {
return {
data: {}
};
}];
});
app.controller(''SingleController'', function ($scope, appState) {
$scope.data = appState.data;
});

Pero si debe ser un controlador singleton, podría usar la directiva ng-controller antes de su directiva ng-view , de modo que se convierta en un alcance de $rootScope para todas sus vistas. Después de eso, simplemente agregue contenedores de funciones vacías en su $ routeProvider para los controladores.

Answer 2

Una solución podría ser la siguiente:

angular.module(''myapp'', []).
config([''$routeProvider'', function($routeProvider) {
$routeProvider.when(''/:templateName/:pageId'', {
templateUrl: function(urlattr){
return ''/pages/'' + urlattr.templateName + ''.html'';
},
controller: ''YourCtrl''
});
}
]);

De la documentación de AngularJs 1.3:

templateUrl - { string | function() }: ruta o función que devuelve una ruta a una plantilla html que debe usar ngView.

Si templateUrl es una función, se invocará con los siguientes parámetros: Array.<Object> - parámetros de ruta extraídos del $location.path() actual aplicando la ruta actual