Question

我在使用ng-repeat时遇到问题：

<div class="col-xs-12 Box">
    <hr class="inline-block">
    <h5 class="text-uppercase">2. Catégorie de Professionnelle</h5>
    <div class="btn-group col-xs-12 styleGarde" data-toggle="buttons">
        <label ng-repeat="childcareWorkerType in childcareWorkerTypes" class="btn btn-info">
            <input type="radio"
                   name="childcareWorkerType"
                   ng-required="true"
                   ng-model="$parent.advertisement.childcareWorkerType"
                   value="{{childcareWorkerType}}"/>
            {{'DOMAIN_ENUM_CHILDCARE_WORKER_TYPE_' + childcareWorkerType | translate}}
        </label>
    </div>
</div>

我使用ng-inspector，我注意到广告的childcareWorkerType属性总是丢失。换句话说，ng-model未填充。

我尝试将ng-model属性指向$parent范围无效...

有人可以帮忙吗？

Answer 1

您应该将模型放在某种类型的包装器中，该包装器是在调用ng-repeat之前创建的。这将确保ng-repeat不在自己的范围内创建模型。

控制器代码

function MyCtrl($scope) {
    $scope.model = {};
    $scope.types = ['one', 'two', 'three'];
}

查看代码

<div ng-controller="MyCtrl">
    <label ng-repeat="type in types" class="btn btn-info">
       <input type="radio"
           ng-required="true"
           name="type"
           ng-model="model.selectedType"
           ng-value="type"/>
        {{type}}
    </label>
    <div>
        Selected value: {{model.selectedType}}
    </div>
</div>

以下是jsfiddle

的链接

单击单选按钮（由ng-repeat生成）时，从不填充ng-model

1 个答案: