Angularjs-Marterializecss:可重复使用的radiobutton - group

时间:2015-02-13 14:17:11

标签: javascript angularjs materialize

我目前正在与Angularjs建立一个网站(我的第一个)。我遇到了一个我可以解决的问题'似乎要解决。

情况: 在某种形式中,某个用户必须选择多个部门(链接到我的模型上的不同字段)。由于这些选择者的部门'总是一样的我选择使用指令。

指令

app.directive('selectDepartment', function () {
    return {
        restrict: 'E',
        scope: {
            ModelfieldToUpdate: '=',
            collectionvalues: '=',
        },
        link: function (scope, elem, attrs)
        {
            //Get Attributes
            attrs.$observe('modalid', function (value) {
                scope.myModalId = value;
            });
            scope.$watch('modelfield', function (value) {
                scope.selectedValue = scope.ModelfieldToUpdate;
            });
        },
        template:'<div>' +
            '<div id="{{myModalId}}" class="modal">' +
                '<div class="modalContentCollection">' +
                    '<form action="#">' +
                        '<p ng-repeat="itm in collectionvalues>' +
                            '<input name="{{myModalId}}collectionGroup" ng-model="$parent.selectedValue" value={{itm}} type="radio" id="{{itm}}"/>' +
                            '<label for="{{itm}}">{{itm}}</label>' +
                        '</p>' +
                    '</form>' +
                '</div>' +
                '<div class="modalMenu centered">' +
                          //Some buttons here
                '</div>' +
            '</div>' +
          '</div>' +
          '</div>'
    }
});

html中的用法

<selectDepartmentmodelfield="Unit.DepartmentA" collectionvalues="MyDepartments" modalid="modalSelectDepartmentA"></selectafdeling>
<selectDepartmentmodelfield="Unit.DepartmentB" collectionvalues="MyDepartments" modalid="modalSelectDepartmentB"></selectafdeling>

输出html(MyDepartments中的第一个itm)

Snippet out of first:
    <input name="modalSelectDepartmentAcollectionGroup" ng-model="$parent.selectedValue" value=FIN type="radio" id="FIN"/>
==> Does work

Snippet out of the second:
    <input name="modalSelectDepartmentBcollectionGroup" ng-model="$parent.selectedValue" value=FIN type="radio" id="FIN"/>
==> Does not work. Even clicking it won't select it.

问题:

尽管radiobutton组具有不同的名称,但它们似乎仍然充当同一个无线电 - 但是组合。任何人都有任何想法?

0 个答案:

没有答案