Question

我为多个视图使用相同的控制器。我想根据所采用的路线不同地参数化控制器。

视图显示基本相同的角度ui网格，因此显示相同的控制器。但是，在一个视图中，我想为特定数据预先过滤网格，而在另一个视图中我不想。

我该怎么做？

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) { .. }]);

Answer 1

这样想。两个路由都是相同的，除了一个有过滤器而一个没有。所以实际上它是相同的路径，附加参数filter='some'正确，所以你的配置可能是这样的：

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

并且在您的控制器中，您将$routeParams.filter问号作为可选参数。然后在Ctrl中，您只需查找过滤器参数并使用过滤器进行适当渲染。顺便说一句，你的视图可以保持不变只是过滤你的网格。如果过滤器参数不存在，它将返回相同的数据（未过滤的）

希望有所帮助。

Answer 2

在基础级别，您可以检查current route以查看正在使用的模板并将其分支。

app.controller('Ctrl', function($route) {
  if ($route.current.templateUrl === '/foo.html') {
    doFoo();
  } else {
    doBar();
  }
});

只有在为每条路线使用不同的模板时，这才有效。如果您想重复使用相同的模板，resolve property of the route非常有用。

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();
  }
});

甚至比这更好，resolve属性可以接受返回值或 promises的函数，因此您可以在那里对数据进行预过滤。

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);
});

AngularJS：通过路径参数化控制器

2 个答案: