以下是一个示例代码，展示如何在页面加载时将第一个选项卡设为活动状态：

HTML代码：

  

    
Tab 1
    
Tab 2
    
Tab 3
  
  

    
Content for Tab 1
    
Content for Tab 2
    
Content for Tab 3
  

JavaScript代码：

var app = angular.module('myApp', []);

app.controller('myCtrl', function($scope) {
  $scope.activeTab = 1;

  $scope.isActiveTab = function(tab) {
    return $scope.activeTab === tab;
  }

  $scope.setActiveTab = function(tab) {
    $scope.activeTab = tab;
  }
});

在这个示例中，首先在ng-app和ng-controller指令中定义了一个AngularJS应用程序和控制器。然后，在HTML中使用了ng-class指令来根据当前活动选项卡的状态动态设置选项卡的样式。

在控制器中，$scope.activeTab变量被初始化为1，并且isActiveTab函数用于检查给定的选项卡是否是当前活动选项卡。setActiveTab函数用于设置当前活动选项卡。

当用户点击选项卡时，ng-click指令会调用setActiveTab函数并传入相应的选项卡索引。这会更新activeTab变量的值，并且isActiveTab函数会根据新的值决定哪个选项卡应该处于活动状态。

在页面加载时，由于$scope.activeTab被初始化为1，因此第一个选项卡被设为活动状态。