2014-12-02 1 views
2

UI를 사용하는 방법을 알아 내려고하고 있습니다. 부트 스트랩 Typeahead (http://angular-ui.github.io/bootstrap/)는 드롭 다운에서 선택하면 모델 값만 설정하고, 선택하지 않으면 필드를 지 웁니다.각도 UI 부트 스트랩 - Typeahead 드롭 다운 값을 선택하지 않은 경우 모델 값을 지우시겠습니까?

다른 컨트롤이있는 경우에도 작동합니다.

Typeahead는 개체를 선택하고 사용자가 몇 개의 문자를 입력하고 필드를 떠날 경우 모델 값은 필드의 문자열 값으로 설정됩니다. 분명히이 경우를 테스트 할 수 있지만 범위 모델 값을 수정해도 양식 유효성이 새로 고쳐지지 않습니다. 따라서 필자가 필수 입력란을 가지고 있으면 입력란의 유효성을 false로 설정해야합니다.

이 모든 것은 이미 누군가가 알아 내야 만하는 많은 작업처럼 보입니다. 어떤 제안? 또 다른 내가 있다고 생각했다

편집, 서버에 다시 제출되는 범위 값에서 선행 입력을 분리하는 가장 좋은 방법은

입니까?

답변

5

비슷한 문제가있었습니다. 내가 주변을 돌아 다니는 방법은 blur 이벤트를 사용하여 유효성을 검사하는 것입니다.

<input type="text" ng-model="yourModel" ng-blur="validateSelection() 
    typeahead="item for item in list | filter:$viewValue""> 
+0

이것이 결국 해결 방법입니다. 비록 내가 컨트롤 자체에 대한보다 완벽한 본격적인 pull 요청을하고 있기 때문에 나는 이것을 아직 업데이트하지 않았다. 이 기능을 구성 가능한 옵션으로 만들기 –

+0

@JoshRusso 마우스로 선택을 처리하는 방법은 무엇입니까? blur 이벤트는 select 이벤트 전에 발생하고 모델 값이 변경되기 전에 발생합니까? – hansmaad

+0

@hansmaad 당신이 물어 줘서 다행입니다, 그것은 훌륭한 점입니다. 'SetTimeout()'속임수를 사용해야합니다. 'validateSelection()'함수의 본체는'SetTimeout()'호출에 랩핑되고 타임 아웃 ID를 캡쳐해야합니다. 메뉴의 클릭 이벤트에서'clearTimeout()'으로 타임 아웃 호출을 취소합니다. 흐림을 유발하는 것은 click 이벤트이기 때문에 지연 값을 설정하지 않아도됩니다. 시간 초과가 작동하는 방식은 본질적으로 유효성 검사 본문을 일련의 호출에서 호출 된 마지막 것으로 이동시킵니다. –

관련 문제