what happens to scope property if two controllers that apply to one html element define it on scope

问题

I have the following HTML:

<div ng-controller="MainController">
    <div class="words">
      <span ng-repeat="word in words" ng-click="setActiveWord(word)"> {{word.name}}</span>
    </div>

    <tabset>
      <tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" disabled="tab.disabled">
        {{activeWord.name}}
      </tab>
    </tabset>
</div>

Then I have a definition for the MainController which adds tabs property to the scope:

.controller('MainController', ['$scope', function($scope) {
  $scope.setActiveWord = function(word) {
    $scope.tabs[0].active = true;
  }

  $scope.tabs = [
    { title:'Dynamic Title 1', content:'Dynamic content 1' },
    { title:'Dynamic Title 2', content:'Dynamic content 2' }
  ];
}]);

Then tabset directive from here also introduces its own controller TabsetController which also defines the tabs property on the scope:

.controller('TabsetController', ['$scope', function TabsetCtrl($scope) {
  var ctrl = this,
      tabs = ctrl.tabs = $scope.tabs = [];

Which contoller's tabs property will be used for the element? Please see this Plunker for complete example.

来源：https://stackoverflow.com/questions/24733416/what-happens-to-scope-property-if-two-controllers-that-apply-to-one-html-element