AngularJS 지시문에 'required'를 전달할 수 있습니까?

Question

<input> 자체를 사용하는 사용자 지정 자동 완성 지시문을 만들고 있지만 '필수'특성을 전달하는 방법을 알아내는 데 어려움을 겪고 있지만 볼 수있는 값이있는 다른 특성은 필요합니다. '는 설정 여부와 관계없이 공란으로 보입니다. 내 반환 명세서의 첫 번째 부분은 다음과 같습니다.

return { 
      restrict: 'E', 
      template: tpl, 
      replace: true, 
      scope: { 
       suggestionsPath: '=autoComplete', 
       method: '@method', 
       term: '@term', 
       required: '@required', 
       ngModel: "=" 
      }... 

감사합니다!

Answer 1

저는 입력에 대한 몇 가지 확장 기능을 구축했으며 지시문에서 ngModelController를 사용하여 기존 ngModel 바인딩을 확장하는 최선의 방법은 틀림 없습니다. "require"속성을 사용하여 다른 지시자의 컨트롤러를 요구할 수 있습니다. The documentation for ngModelController is here

이렇게하면 모델 값을 가져 오거나 설정할 수 있으며 필요에 따라 유효성 검사 동작을 확장하거나 바꿀 수 있습니다. 이제는 AngularJS 입력 지시문을 함께 사용하여 확장하기 때문에 AngularJS의 입력 지시문을보고이 작업의 예를 살펴볼 수도 있습니다. 또한 ngFormController 접미어로 전체 양식의 부모로 사용할 수 있습니다. 이것은 나를 잡기 위해 오래 걸렸으므로 인내심을 가져라. 그러나 이것을하는 것이 훨씬 좋은 방법이다.

여기에서는 범위를 분리하지 않아야하며, 까다로워 질 수 있습니다. 항상 다른 지시문과 잘 어울리지는 않습니다. 따라서 일반적으로 새 요소 나 자체 지시문이 하나만있는 곳에서만 사용하십시오. 나는 사용자 정의 입력이 (우리가 +/- 버튼을 추가 사용자 입력을 구축 그들이 무엇에 따라 꽤 까다로운 얻을 수있는 지침 디자인 당신이 할 수있는만큼 익숙해 추천

return { 
     restrict: 'E', 
     template: tpl, 
     replace: true, 
     require: 'ngModel', 
     link: function(scope, element, attrs, ngModelController) { 
      // Use attrs to access values for attributes you have set on the lement 
      // Use ngModelController to access the model value and add validation, parsing and formatting 
      // If you have an attribute that takes an expression you can use the attrs value along with $scope.$watch to check for changes and evaluate it or the $parse service if you just want to evaluate it. 
     } 

: 나는 이런 식으로 뭔가를 디자인 할 것이다 숫자를 백분율, 통화 또는 쉼표로 숫자를 입력하는 동안 서식을 지정하는 것). 이외에도 이러한 유용한 ngModelController의 문서에서 검토하기 :

• Egghead.io tutorials
• input directives 및 forms

Answer 2

재미있는 속성이 약간 필요합니다 (여기 Setting an attribute named "required" and any value, with JQuery, doesn't work 참조). 당신은 그 효과가 그 가치에 의해서가 아니라 그것이 존재하는지에 의해 결정되기 때문에 이것에 대한 어떤 종류의 가치를 전달하는 데 많은 어려움을 겪을 것입니다. 브라우저마다 다르게 처리되므로 값을 다시 쓸 수 있습니다.

required 및 ngModel이 모두 제공되면 지침에 따라 문제가 발생합니다. required은 ngModel과 대화 할 것이므로 일을 원하면 ngModelproperly을 구현해야합니다.

더 간단한 옵션은 required 및 ngModel의 이름을 다른 이름으로 바꾸는 것입니다. 예 : myRequired 및 myNgModel. 그런 다음 ng-model을 scope.myNgModel에 직접 바인딩하고 ng-required을 myRequired에 바인딩 할 수 있습니다.

Answer 3

나는이 오래된 질문입니다 알고뿐만보고 와서 다른 사람에 대한 AngularJS와 코드 (이) 여기에 끝난 방법 :

부울로 읽을 지시문에 필요한 태그를 전달한 다음 해당 값을 ng-required에 사용할 수 있습니다.

return { 
    restrict: 'E', 
    template: tpl, 
    replace: true, 
    scope { 
     required:'@' 
    } 

그런 다음 지시어 템플릿에 당신이

<input type="text" ng-required="required" /> 

어느 속성 '필요'로 사용하는 것이 발견 된 후 지시에 true로 설정하거나 속성이 발견되지 않는 것 ng-required에 의해 거짓 값으로 해석됩니다.