2016-07-08 2 views
1

그래서 ng 반복 아코디언에 삭제 기능을 추가하려고합니다. 단추가 표시되고 기능이 설정되었지만 삭제 단추를 누르면 페이지가 거의 다시로드 된 다음 localhost : 8080/#으로 리디렉션됩니다. 그러나 여기로 리디렉션해서는 안되며 여기로 리디렉션해야한다는 제안은 없습니다 어쨌든 내가 볼 수있는 것이 아니라, 이것이 문제의 하나 일까? 그러나 이것은 볼 수 없습니다 ..AngularUI 삭제 ng-repeat의 아코디언

페이지가 새로 고쳐지면 응용 프로그램이 아직 호스트되지 않으므로 모든 데이터가 현재 편집보기로 전달 될 때 손실됩니다. 앞에있는보기는 행 중 하나를 클릭하고 편집 페이지로 이동하기 전까지 표에 표시합니다. 여기

내 JS 기능 삭제됩니다 : 여기

$scope.delete = function (index, event) { 
    if(event) { 
     event.preventDefault(); 
     event.stopPropagation();  
    } 

    $scope.selectedTestScript.Actions.splice(index, 1); 
    } 

을 그리고 나의 NG 반복 아코디언입니다 :

<uib-accordion close-others="oneAtATime"> 
    <uib-accordion-group ng-repeat="action in selectedTestScript.Actions" is-open="action.isOpen" ng-click="action.isOpen=!action.isOpen"> 
      <uib-accordion-heading> 
       <div>{{action.Description}}<button type="button" class="btn btn-xs btn-danger pull-right" ng-click="delete($index, event)"></i>Delete</button></div> 
      </uib-accordion-heading> 
      <div> 
      <label for="actionNotes" class="control-label col-xs-2">Action Notes</label> 
      <div class="col-xs-10"> 
       <textarea id="actionNotes" type="text" rows="4"ng-model="action.Notes" class="form-control" name="name"></textarea> 
      </div> 
      </div> 
      <div> 
      <label for="actionExpected" class="control-label col-xs-2">Action Expected</label> 
      <div class="col-xs-10"> 
       <input id="actionExpected" type="text" ng-model="action.ExpectedOutcome" class="form-control" name="name"> 
      </div> 
      </div>     
    </uib-accordion-group> 
</uib-accordion> 

어떤 도움이 많이 주시면 감사하겠습니다, 나는 기능을 단순화하고 제거하려고했습니다 if (event) 문을 스플 라이스로 남겨 두지 만 작동하지 않습니다.

미리 감사드립니다.

답변

1

게시 한 코드를 둘러싼 양식이 있으십니까? 이 경우 type이 지정되지 않은 <button>을 사용하면 기본값은 type=submit으로 기본 설정되어 원본 HTML 양식을 트리거하므로 리디렉션됩니다.

type에서 button까지 설정할 수 있습니다.

action.isOpen==!action.isOpen도 올바르게 보이지 않습니다. 단일 =을 의미합니까?


편집 : 아코디언 내에서 클릭 할 수있는 요소를 사용하려면

알려진 문제

를 읽고 ui-bootstrap accordion 아래 단락이 실제로있다, 당신은 아코디언 그룹 템플릿을 무시해야 앵커 요소 대신 div 요소를 사용하고 CSS에 cursor : pointer를 추가합니다. 이는 버튼이 앵커 요소 내에 중첩 된 경우 이 라우팅을 트리거하는 모든 클릭 이벤트의 대상으로 앵커 요소를 해석하기 때문입니다.

http://angular-ui.github.io/bootstrap/#/accordion

+0

아코디언 양식의 외부 실제로, 그러나 나는 유형 = "버튼"을 추가하고이 영향을 미치지 않았다,하지만 제안을 주셔서 감사합니다. 또한 action.isOpen =! action.isOpen을 업데이트했지만이 기능 (놀랍게도)은 여전히 ​​double ==를 사용했습니다. 제안 해 주셔서 감사합니다. 모두 큰 도움이됩니다. – Callum

+0

uib-accordion 지시문이 런타임에 한 번 더 html을 생성하므로 아마 href 속성을 추가하기 때문일 수 있습니까? 진실이 아닌 질문입니다. 한번 html을 살펴 보았는데 위의 증거를 찾지 못했습니다. – Callum

+0

@Callum 나는 거기에 문서화 된 아코디언의 알려진 이슈 중 하나가 될 수도 있다고 생각한다. – Icycool