2014-02-24 3 views
1

새로운 개념이며 속성을 기반으로 지시문에 유효성 검사를 추가하려고합니다. 다음은 지침을 사용하는 방법입니다.AngularJS 지시문의 HTML 요소에 속성 추가

<div sc-textbox data-bind-to="fieldToBind" data-field-name="fieldName" data-required="someValue != 'Office'"></div> 

데이터 필수 속성은 존재하지 않을 수도 있습니다. 이 지침에 대한 템플릿은 다음과 같습니다

<input id="{{fieldName}}" name="{{fieldName}}" type="text" data-ng-model="bindTo" /> 

데이터-필수 속성이 존재하면 내가 추가 할 데이터 NG를 필수 = "{{필수}}"입력합니다. 이 일을 어떻게 하죠?

이 지침의 범위는 다음과 같습니다

scope: { 
    'bindTo': '=', 
    'fieldName': '@', 
    'required': '=' 
} 

어떤 도움을 크게 감사합니다.

답변

0

범위가 제한되어 있으므로 "someValue! = 'Office'"를 나타내는 지시문의 범위에 부울이 필요합니다.

또는 범위에 someValue와 넣어 이렇게 :

<input id="{{fieldName}}" 
    data-ng-required="(someValue != 'Office') && required" 
    name="{{fieldName}}" type="text" 
    data-ng-model="bindTo" /> 

업데이트

는 "데이터 NG가 필수"추가 할 속성 지시문입니다. Angular에서 DOM의 지시문을 동적으로 추가하거나 제거 할 수 없습니다. DOM의 일부에서 "data-ng-required"를 원하지 않고 이것을 동적으로 만들고 싶다면, $ compile과 $ input을 2 개의 템플릿으로 추가해야합니다. 하나는 제외됩니다.

+0

data-required = "someValue! = 'Office'"는 조건부 필수의 예일뿐입니다. 간단히 data-required = "true"일 수도 있고 아니면 함께 생략 할 수도 있습니다.이 경우에는 data-ng-required가 전혀 필요하지 않습니다. 나는 그것이 의미가 있기를 바란다. – Elliot

+0

Angular에서 템플릿의 HTML을 수정할 수 있습니까? 및 data-ng-required와 같은 속성을 추가하거나 지시문을 추가 할 수 없다는 문제가 있습니까? $ compile이 언급되어 있습니다. 컴파일 기능에서 이것을 수행 할 수 있습니까? – Elliot

+0

컴파일하기 전에 원하는대로 할 수 있습니다. 예제 : dest.append ('

{{stepNumber}}

') ($ scope)); – koolunix

0

어쨌든 거기에 두십시오. 이것이 바로 그 때문입니다.

+0

을 어떻게 생성하는지에 달려 있습니다. 이 지시어는 모든 양식의 모든 텍스트 상자에 사용되며 경우에 따라 필드가 필요하고 다른 경우에는 지시문에 데이터가 필요한 세트가있을 때 ng-required를 추가하기를 원합니다. – Elliot

관련 문제