md-tabs: allow function to be used as selectedIndex

[jasonayre]

Right now if I want to use a function for selectedIndex, it throws the following error

 'selectedIndex()' used with directive 'mdTabs' is non-assignable!

Use case (sorry using ng-classy controller if it looks weird I can translate:

  init: function() {
    var self = this;
    this.$scope.resource = this.widget;
    this.base_route = 'widgets.resource.form';

    this.$scope.tabs = [
      { heading: "<i class='fa fa-info-circle fa-fw'></i> First Tab", route: "first", visible: true },
      { heading: "<i class='fa fa-question-circle fa-fw'></i> Second Tab", route: "second", visible: (!this.$scope.resource.isNew()) },
      { heading: "<i class='fa fa-envelope fa-fw'></i> Third Tab", route: "third", visible: (!this.$scope.resource.isNew()) }
    ];
  },
  currentRouteName: function() {
    return this.$state.current.name.split(".").pop();
  },
  tabSelected: function(tab) {
    this.go(tab.route);
  },
  selectedIndex: function() {
    var self = this;

    return _.findIndex(self.$scope.tabs, function(scope_tab){
      return (scope_tab.route == self.currentRouteName());
    });
  },

Its actually working for me currently, but its still trying to assign selectedIndex which is obviously in my case a function, so throwing the error. It looks as if the directive overall was not built to support this, yet I could have sworn I had it working flawlessly in (much) earlier versions. -- Anyways it would be nice to have an interface that would allow for the above, whether assigning directly to selectedIndex or a new selectedTab argument, which is expected to be a function which returns the selected tab index. Particularly helpful for use w UI router

[ThomasBurleson]

@jasonayre - As you have discovered, Tabs uses a two-way databinding to the the md-selected expression. Here is a CodePen Demo that shows the usage of Tabs, selectedIndex, and ngRoute:

$scope.$watch('selectedIndex', function(current, old) {
  switch(current) {
    case 0: $location.url("/view1"); break;
    case 1: $location.url("/view2"); break;
    case 2: $location.url("/view3"); break;    
  }
});

The important AngularJS Best Practice is to let data-binding do the work for you.