angular标签页实现两种方式

一、通过普通指令实现标签页

  

    
标签1
    
标签2
  
  

    

      标签1的内容
    
    

      标签2的内容
    
  


说明
这里演示的是直接通过bootstrap实现的方法。
还可以通过angular-bootstrap的tabset指令实现，参见 官方Demo


'use strict';

angular.module('ngShowcaseApp').controller('ctrl.show.tab', function ($scope) {
  var vm = $scope.vm = {};
});


.tab-content.tab-bordered {
  border: 1px solid lightgray;
  border-top: none;
  padding: 15px;
  border-radius: 0 0 4px 4px;
}

二、自定义指令实现的标签页

（1）首先要解决指令必须写在一个根标签中，一定要用div包裹
（2）指令外部传递参数要使用ng-model，来声明变量，
在指令中用scope：{
value:'ngModel'
}来赋值
还有比较复杂的是通过船体到父级的作用域进行通信，这个暂时没有搞明白，稍后更新，一定要回来哦！