How can I pass a custom property to `$modal` from `angular-ui-bootstrap`

On two occasions I will have to open a modal like this:

    $modal.open({
      templateUrl: "components/prize-info/prize-info.html",
      windowClass: "prize-info",
      scope: $scope,
      controller: "PrizeInfoController"
    });

I have to create two identical modals that differ only in the prizes it'll show - which are two different arrays in the very same $scope.

So - instead of duplicating the controller from above and it's template, changing only the prop of the scope, providing the prizes - how can I pass something to the $modal.open method and use one and the same controller, which will loop different scope's prizes?

If your scope already has both arrays, passing the scope to the modal means you already have those arrays available in the modal's scope. Just grab them from there.

Alternatively you can pass it via the resolve property.

See the docs for resolve

resolve (Type: Object) - Members that will be resolved and passed to the controller as locals; it is equivalent of the resolve property in the router.

$modal.open({
  templateUrl: "components/prize-info/prize-info.html",
  windowClass: "prize-info",
  scope: $scope,
  controller: "PrizeInfoController",
  resolve: {
    myData: () => {
      // return your data
    }
  }
});