0

저는 ionic 및 angularjs를 사용하여 작업 포털 앱을 설계했습니다. 페이지 이름은 skills.html입니다. 어떤 코드가 다음과 같습니다페이지로드시 동적으로 추가 된 필드를 이온으로 표시합니다.

<ion-view> 
<ion-nav-title> 
    <span>Skills</span> 
    </ion-nav-title> 
    <ion-content> 

    <div class="row responsive-sm" ng-repeat="item in inputs"> 
     <div class="col col-center">    
      <div class="list list-inset"> 
       <span class="input-label">Skill:</span> 
       <input type="text" placeholder="Enter Skills" id="skill" name="skill" ng-model="skills[$index]"> 
      </div> 

      <div class="list list-inset"> 
       <span class="input-label">Proficiency:</span> 
       <select ng-model="proficiency[$index]"> 
        <option value="Beginner">Beginner</option> 
        <option value="Intermediate">Intermediate</option> 
        <option value="Advanced">Advanced</option>    
       </select> 
      </div>    

     </div> 
    </div> 
    <div class="row responsive-sm"> 
     <div class="col"> 
     <div class="list list-inset"> 
      <button class="button button-block button-positive" ng-click="submit_skill_details()">Submit</button> 
      </div> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="col col-50"> 
     <button class="button button-block button-assertive" ng-click="addskills()">Add Skills</button> 
     </div> 
     <div class="col col-50"> 
     <button class="button button-block button-royal" ng-click="deleteskills()">Delete Skills</button> 
     </div> 
     </div> 

    </ion-content> 
</ion-view> 

저의 경우 실력이 입증되었습니다. 로그인시 제출 된 기술을 보여줄 수 있습니다. 제출 된 스킬을 표시하려면 "스킬 추가"버튼을 클릭해야하지만 페이지로드시 표시하고 싶습니다. 예 : 사용자가 html과 같은 하나의 스킬 만 제출 한 경우 pageload에서 html을 포함하는 입력 필드가있는 한 행을 표시해야합니다. 사용자가 숙련도가있는 html을 초보자에게 제출하고 스킬 추가 버튼을 클릭하면 숙련도와 함께 다음 스킬 CSS를 추가하고 사용자가 스킬 페이지로 이동하여 2 행을 표시해야합니다. html과 css를위한 한 행. 처럼

+0

플 런커를 만들려면 – Anuj

+0

플 런커를 만드는 방법은 무엇입니까? – Priyanka

+0

코드를 http : //codepen.io/에 업로드하십시오. http://codepen.io/anujsphinx/pen/Lbryzz – Anuj

답변

0
<div> 
       <label>Drop Down</label> 
       <select id = "prof" ng-model="newPayment.prof"> 
       <option value="Beginner">Beginner</option> 
       <option value="Intermediate">Intermediate</option> 
       <option value="Advanced">Advanced</option>    
      </select> 
      </div> 

데이터는 : $ scope.payments = [{ ID : 1 교수 '초보 }, { ID : 2 교수'초보 }, { id : 3, prof : 'Intermediate' }];

기존 스킬을 클릭하면 데이터가 이미 드롭 다운되고 표시됩니다.

+0

과 같은 샘플을 가져 오지 마십시오. :-( – Priyanka

관련 문제