문자열을 분할하고 다음과 같은 상황 복제 이온

Question

내가 좋아하는 것을 각도 2를 사용하여 검증 : 나는 문자열을

을의 내가 반으로 분할 할

123BCP456GF789 

말을하자 사용자에게 누락 된 번호를 삽입하고 올바른 번호가 맞는지 확인하십시오.

은 다음과 같이 될 것이다 : 나는이 작업을 수행 각도 2 이온 2를 사용하고

123B <ion-input></ion-input> F789 

, 누군가가 나를 도울 수 있다면, 나는 주셔서 감사합니다.

numberList = ['123BCP456GF789', '46487951', '65135564', '46489633']; 

      <ion-list> 
       <ion-item> 
        <ion-label stacked primary>Complete with the mising number</ion-label> 
        <ion-item>{{numberList_firstpart}}</ion-item> 
        <ion-input></ion-input> 
        <ion-item>{{numberList_lastpart}}</ion-item> 
       </ion-item> 
      </ion-list> 

감사 :

이의 내가이 배열 있다고 가정 해 봅시다!

Answer 1

간단한 해결책, AngularJS와 독립적이 될 수 있습니다 :

이

var numberList = ['123BCP456GF789', '46487951', '65135564', '46489633']; 

numberList.forEach(function(element) { 

    //total length of the string 
    var elLength = element.length; 

    //get the max number of characters usable for first and second part 
    var singleElementLength = Math.ceil(elLength/3); 

    //the first part of the string 
    var firstPart = element.substring(0, singleElementLength); 

    //the last part of the string 
    var lastPart = element.substring(element.length-singleElementLength, element.length); 

    //this one should be entered by user 
    var middlePart = element.replace(firstPart, '').replace(lastPart, ''); 

    console.log(firstPart); 
    console.log(middlePart); 
    console.log(lastPart); 


}); 

가 출력 될 것입니다 : 당신이 원하는 경우 Math.ceil() 대신 Math.floor()을 사용할 수 있습니다

"123BC" 
"P456" 
"GF789" 

"464" 
"87" 
"951" 

"651" 
"35" 
"564" 

"464" 
"89" 
"633" 

:이 일을하는 원인이됩니다 가운데 부분을 길게하려면 아래 출력을 참조하십시오.

"123B" 
"CP456G" 
"F789" 

"46" 
"4879" 
"51" 

"65" 
"1355" 
"64" 

"46" 
"4896" 
"33" 

참고 :이 방법을 사용하려면 적어도 3 자 이상의 문자열이 있어야합니다 (아마도 더 많은 수는 Math.ceil()과 Math.floor() 사이에 사용하는 것에 달려 있습니다). 나는 이것을 위해 몇 가지 컨트롤을 추가 할 것을 제안한다.

Answer 2

당신의 작업은 두 가지입니다 :

사용자 입력을 캡처하려면, 그것은 데이터 입력 할 때마다 바인딩 것 정답에 대한 사용자 입력을 비교

1. 캡처 사용자 입력 및
2. 텍스트의 사용자 키

   <ion-input (keyup)="captureInput($event)"></ion-input> 
   

   데이터 입력을 캡처하는 방법은 여러 가지가 있습니다. 그것은 정확한 답과 비교할시기에 달려 있습니다 (예 : 버튼 클릭, 초점 손실 등)

   마지막 부분은 정답과 비교 한 것입니다. 자바 스크립트 정규식 테스트, 예를 들면 ..

   /the correct answer/.test(`${ this.first_part }${ this.input }${ this.last_part }`) 
   

   귀하의 실제 구현은 코딩 사항을 지시 할 것이다, 그러나 희망 당신은 무슨 말인지의 요점을 얻는다.

   희망이 도움이됩니다.