Angadeディレクティブ属性とそのテンプレートにJadeのクラスとしてリンクする

Question

カスタムAngularディレクティブにそのマークアップの属性を渡し、その属性をそのディレクティブのテンプレートのコンテナの1つのクラスとして割り当てる必要があります。ここで

は私の入力がジェイドに、どのように見えるかです：ここでは

.form-layout-group 
    short-text-input.item(label="Short Input Group", inputColumnsClass="short-text-2") 

は私の指示を返す関数です：私のテンプレートで

function ShortTextInput (FormControlService) { 
    restrict: 'E', 
    replace: true, 
    require: ['^validationForm', '?ngModel', '^?formCollection'], 
    scope: { 
    inputColumnsClass: '@' 
    }, 
    templateUrl: '/templates/input/shortTextInput/short-text-input.html', 
    link: FormControlService.link 
}) 

、私は次のことをしようとしている：

include ../../input/_input-mixins.jade 

+WrapInputwithLabelAndErrorplaceholder 
    div.inner-icon 
    div(class="{{ inputColumnsClass }}") 
     +InputwithValidation.item 

残念ながら、私はこの列クラスを表示することはできませんし、私の好みの入力を実際にスタイルするd方法。このクラスをテンプレートにハードコードするとき、私がやってみたいことはうまく動作します。

私はこれにどのように接近すべきかに関するヒントを教えてください。

Answer 1

input-columns-class="short-text-2"である必要があります。

input-columns-classinputColumnsClass DOM属性はinputcolumnsclassに正規化されながら、DOM属性は、$compileサービスによってnormalizedinputColumnsClassにキャメルケースの形態です。