Question

我是angularjs的新手，有一个应用程序，想要显示一个无线电输入列表。当用户点击其中一个时，标签文字就会消失。下面的html和js：

HTML

<form>
<ul class="list-unstyled">
    <li ng-repeat="domain in domains track by $index">
        <input type="radio" name="domain" id="{{$index}}" ng-model="domain">
        <label for="{{$index}}" ng-bind="domain.name"></label>
    </li>
</ul>
<input class="btn btn-success" value="Submit" type="submit">

控制器

app.controller('domainsCtrl', ['$scope', '$http', function($scope, $http){
$scope.domains = [
    {
        name: 'smart.ir'
    },
    {
        name: 'idiot.com'
    },
    {
        name: 'smartalec.net'
    }
]
}]);

Answer 1

您正在努力解决的问题是因为在您的重复指令中，所有无线电输入都具有相同的ng Model指令。不允许对angularjs中的1个以上元素使用相同的ng Model指令。您可以使用$ index轻松区分ng Models。只需使用这个：

<form>
<ul class="list-unstyled">
    <li ng-repeat="domain in domains track by $index">
        <input type="radio" name="domain" id="{{$index}}" ng-model="domain{{$index}}">
        <label for="{{$index}}" ng-bind="domain.name"></label>
    </li>
</ul>
<input class="btn btn-success" value="Submit" type="submit">

angularjs点击标签文字消失

1 个答案: