I'm currently trying to use select element in tab blocks.
With ui.bootstrap.tabs, select html element not fire the model on javascript side. You can show my problem
at plunkr.
When you change the outside select element, it alerts selected items id normally. However, the second select element that inside the tab alerts only first selected items id.
Someone tell me that is a bug or my mistake?
This is happening because your view is inside the uib-tabset and it has it's own scope. So selectOption model inside uib-tabset will be in the $scope of the uib-tabset and not in the $scope of the controller.
Hence everytime you change any value alert was showing 1.
I have created an updated plunkr which solves the problem. It can be found at : http://plnkr.co/edit/lbiUUY?p=preview
vm = this //This is the preferred way over $scope for defining variables
But, I suggest you to have a look at angular scope hierarchy. Angujs Scope