2017-05-04 8 views
1

Ich benutze den gleichen Controller für mehrere Ansichten. Ich möchte den Controller abhängig von der gewählten Route unterschiedlich parametrieren.AngularJS: Controller über Route parametrieren

Die Ansichten zeigen grundsätzlich das gleiche Winkel-UI-Raster, daher der gleiche Controller. Auf der einen Seite möchte ich das Raster für bestimmte Daten vorfiltern, in der anderen nicht.

Wie kann ich das tun?

app.config(function ($routeProvider) { 
    $routeProvider 
     .when('/foo', 
      { 
       controller: 'Ctrl', 
       templateUrl: '/foo.html', 
      }) 
     .when('/bar', 
      { 
       controller: 'Ctrl', 
       templateUrl: '/bar.html', 
      }); 
}); 

app.controller('Ctrl', ['$scope' function ($scope) { .. }]); 
+0

was meinst du mit parametrieren –

+0

aktualisiert die Frage, um genauer zu sein. – hansi

Antwort

1

auf der Grundstufe, könnten Sie die current route zu sehen, welche Vorlage inspizieren wurde, dass wird verwendet, und abzweigen.

Das würde nur funktionieren, wenn Sie für jede Route verschiedene Vorlagen verwenden. Wenn Sie die gleiche Vorlage erneut verwenden möchten, ist die resolve property of the route sehr nützlich.

app.config(function($routeProvider) { 
    $routeProvider.when('/foo', { 
    controller: 'Ctrl', 
    templateUrl: '/foo.html' 
    resolve: { 
     whichRoute: function() { return 'foo'; } 
    } 
    }); 
}); 

app.controller('Ctrl', function(whichRoute) { 
    if (whichRoute === 'foo') { 
    doFoo(); 
    } else { 
    doBar(); 
    } 
}); 

Und noch besser als das, die resolve Eigenschaften können Funktionen übernehmen, die Werte oder Versprechen zurückzukehren, so konnte man dort die Vorfilterung der Daten tun.

app.config(function($routeProvider) { 
    $routeProvide.when('/foo', { 
    controller: 'Ctrl', 
    templateUrl: '/foo.html', 
    resolve: { 
     dataToDisplay: function(YourDataService) { 
     return YourDataService.getSomeData(); 
     } 
    } 
    }); 
}); 

app.controller('Ctrl', function(dataToDisplay) { 
    doTheThing(dataToDisplay); 
}); 
+0

Vielen Dank! Genau das, wonach ich gesucht habe. – hansi

2

Denken Sie es so. Beide Routen sind gleich, außer einer hat einen Filter und einer nicht. so in Wirklichkeit ist es die gleiche Strecke mit zusätzlichen Parametern filter='some' rechts, damit die Konfiguration könnte wie folgt sein:

app.config(function ($routeProvider) { 
$routeProvider 
    .when('/foo/:filter?', 
     { 
      controller: 'Ctrl', 
      templateUrl: '/foo.html', 
     }) 
}); 

und in Ihrem Controller werden Sie $routeParams.filter Fragezeichen haben würden ein optionaler Parameter sein. Dann in der Ctrl Sie würden nur nach Filter-Parameter suchen und Filter verwenden, um entsprechend zu rendern. Btw Ihre Ansicht kann gleich bleiben nur filtern Sie Ihr Raster sowieso. Wenn der Filterparameter nicht existiert, werden nur die gleichen Daten zurückgegeben (ungefiltert)

Hoffe, dass hilft.

+0

Dies ist der richtige Weg, es zu tun. Die andere Antwort ist Hacky für eckig. Optionale Abfrageparameter sind der Weg zu gehen. – chairmanmow