要创建分组和子分组的下拉列表，可以使用AngularJS的ng-options指令和嵌套的ng-repeat指令。

下面是一个示例代码，展示如何创建一个包含分组和子分组的下拉列表：

HTML代码：

  
    请选择
  

JavaScript代码：

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

app.controller('myCtrl', function($scope) {
  $scope.options = [
    {name: '选项1', group: '分组1'},
    {name: '选项2', group: '分组1'},
    {name: '选项3', group: '分组2'},
    {name: '选项4', group: '分组2'},
    {name: '选项5', group: '子分组1', parent: '分组1'},
    {name: '选项6', group: '子分组1', parent: '分组1'},
    {name: '选项7', group: '子分组2', parent: '分组2'},
    {name: '选项8', group: '子分组2', parent: '分组2'}
  ];
});

在上述示例中，我们使用ng-options指令来创建下拉列表，并使用group by子句将选项按照group属性进行分组。选项的名称由name属性定义。

在JavaScript代码中，我们定义了一个包含选项的数组options。每个选项都有一个name属性和一个group属性，用于定义分组。我们还为子分组添加了一个parent属性，以指定它所属的父分组。

这样，就可以根据选项的group属性将选项分组，并在下拉列表中显示出来。