angularjs - 在 Angular 指令中有条件地应用 ng-class

Question

我对 Angular 很陌生，我正在尝试包装无线电输入：

<input type="radio" ng-model="animal" name="fun" value="dog" radio />
<input type="radio" ng-model="animal" name="fun" value="cat" radio />

并根据单选的值是否等于模型（选择单选按钮）有条件地将指令中的类应用于包装元素

http://jsfiddle.net/TSM_mac/HB7LU/141/

.directive('radio', function() {
    return {
        restrict: 'A',
        link: function(scope, elem, attrs) {
            elem.wrap('<div class="radio-wrap" ng-class="checked:attrs.value==attrs.ngModel}"></div>');
        }
    }  
})

我考虑过使用模板属性，然后用模板包装元素。我也考虑过使用 $compile。

任何建议表示赞赏

Answer 1

首先ng-class="checked:attrs.value==attrs.ngModel}"应该是ng-class="{checked:attrs.value==attrs.ngModel}"

其次，你的表达毫无意义。ng-class在摘要循环期间根据您的视图进行评估。link在您的函数调用期间，它不会在您的指令中进行评估。因此，当评估 ng-class 时，不会有attrs变量，当然，它会评估为 false。