Listando informações dentro de um select

Tenho o seguinte código para mostrar uns Bairros como opção, e ao selecionar o Bairro desejado, mostra uma descrição do mesmo.

Só que não está aparecendo o nome do Bairro na opção, e eu não consigo encontrar o erro.

Código abaixo:

<script>
(function() {
 'use strict';

 angular
 .module('appBairros', []);

 angular
 .module('appBairros')
 .controller('BairroController', BairroController);

 BairroController.$inject = [];

 function BairroController() {
 var bairro = this;
 bairro.opcoes = [];

 iniciar();

 function iniciar() {
 bairro.opcoes = [];
 bairro.opcoes.push({nome: "Botafogo", informacoes: "Botafogo é um bairro que começa com B"});
 bairro.opcoes.push({nome: "Madureira", informacoes: "Madureira é um bairro que começa com M"});

 bairro.seleciona = bairro.opcoes[0];
 }
 }
})();

</script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"> </script>

<div ng-app="appBairros">
 <div ng-controller="BairroController as bairro">
 <label class="bairros">Selecione o Bairro para exibir as informações que deseja.</label>
 <select ng-options="opcao.nome for opcao in bairro.opcoes" ng-model="bairo.selecionado"></select>

 <br>
 <br>

 {{bairro.selecionado.informacoes}}
 </script>
 </div>
</div>