Javascript 单击radiobutton时动态更改容器

我想在单击radiobutton后动态更改容器。我知道我可以使用ng模型和值轻松地做到这一点。 下面是一个JSFIDLE： 当你有一个小容器或者只有一些文本时，它就可以正常工作。但是，我如何使用存储在示波器中的巨大容器来实现这一点呢

function MyCtrl($scope) {
    $scope.value[0]='<div>big container when clicking radiobutton 1</div>'
    $scope.value[1]='<div>big container when clicking radiobutton 2</div>'
    $scope.value[2]='<div>big container when clicking radiobutton 3</div>'
}

函数MyCtrl（$scope）{
$scope.value[0]=“单击单选按钮1时的大容器”
$scope.value[1]=“单击单选按钮2时的大容器”
$scope.value[2]=“单击单选按钮3时的大容器”
}

$scope.value[0]获取了我的单选按钮1的容器，$scope.value[1]获取了我的单选按钮2的容器，$scope.value[2]获取了我的单选按钮3的容器

HTML应该如何动态地完成这一任务？（所谓“动态”是指单击radiobutton会更改容器，如JSFIDLE中所示。）

多谢各位

var myApp=angular.module（'myApp'，[]）；
函数MyCtrl（$scope）{
$scope.number='0'；
$scope.value=[]；
$scope.value[0]=“单击单选按钮1时的大容器”；
$scope.value[1]=“单击单选按钮2时的大容器”；
$scope.value[2]=“单击单选按钮3时的大容器”；
}

{{value[number]}

大型容器有什么问题？你没有指定。我会使用ng开关，将模板逻辑保留在模板中，而不是放在js代码中。这是个好主意，我不知道这个指令！非常感谢。