How to move to second tab on click of a button when using angularjs tab directive

问题

Hi I'm using angular tab directive.The link for JS fiddle is AngularJs Tab Directive .My Question is How can I move to second tab from first tab with click of a button?Thanks

 <tabs>
<pane title="First Tab">
  <button type="button" ng-click="moveToSecondTab()">Second Tab.</button>
</pane>
<pane title="Second Tab">
  <div>This is the content of the second tab.</div>
</pane>

回答1:

Instead of hardcoding the panes in your HTML file, fetch it from your controller. Something like

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

Then from your HTML you can call the function to switch the active tab. Something like this :

$scope.moveToSecondTab = function () {
$scope.tabs[1].active = true;
};

However, it'll be better if instead of a function, you switch the active tab directly from the button.

Use something like this:

<button ng-click="tabs[1].active = true">Select second tab</button>.

Check here for reference.

回答2:

Trigger a click on the second tab. This works for me.

  <!--HTML-->
  <tab id="tabID" heading="Second Tab">

  ///JS
  $timeout(function(){
    angular.element('#tabID a').trigger('click');
  });

来源：https://stackoverflow.com/questions/27311923/how-to-move-to-second-tab-on-click-of-a-button-when-using-angularjs-tab-directiv