HTML 및 AngularJS 토글 버튼

Question

샘플 애플리케이션을 구현 중이며 Twitter의 것과 유사한 Follow 버튼을 구현해야합니다. 다음 I 버튼을 부호화 한

,

<button class="btn pull-right{{setButtonStyle(S.Id)}}" 
ng-class="{true:'btn-primary', false:'btn-secondary'}[!S.isFollow]" 
ng-click="toggleFollow(S.Id)"> {{!S.isFollow && 'Follow' || 'Unfollow'}} 
</button> 

ng-click 기능도 DB 테이블을 처리 및 UI 버튼을 토글.

$scope.toggleFollow = function (userId) { 
    var element = $scope.followIds.indexOf(userId); 
    if (element == -1) { 
     // Follow user 
     $scope.Searched[Sindex].isFollow = !$scope.Searched[Sindex].isFollow; // Toggles the button 
     console.log("Follow called"); 
     }) 
    } else if (element > -1) { 
     // Unfollow user 
     $scope.Searched[Sindex].isFollow = !$scope.Searched[Sindex].isFollow; // Toggles the button 
     console.log("Unfollow called"); 
     }) 
    } 
} 

문제는 버튼이 무작위로 전환되지 않는다는 것입니다. 저는 AngularJS 다이제스트 루프가 버튼을 클릭 할 때마다 작동하지 않는다고 생각합니다.

버튼을 클릭 할 때마다 Angular 함수가 호출된다는 것을 알고 있습니다. 따라서 토글은 예상대로 실행되지 않습니다. 그렇다면 클릭 할 때마다 버튼을 어떻게 토글해야합니까? 귀하의 경우에는

Answer 1

, 최선가 사용의 각도 $ 적용()

$이 적용 - 그래서, 처음에는 약간의 코드를 실행 한 후 방법 내부적으로 $ 다이제스트()를 호출하는 데 사용됩니다 모든 시계이 확인되고 해당 시청 수신기 기능이 호출됩니다.

두 가지 방법으로 이루어집니다.

첫 번째 방법 - 쓰기 버튼의 구현 - $ 예를 아래에

$scope.toggleFollow = function (userId) { 
    if (element == -1) { 

     //...your button's implementation code 

    } 
    else if (element >= -1) { 

     //....your button's implementation code 

    } 

    //Call $apply() 
    $scope.$apply(); 

} 

두 번째 방법 (시스템 권장)처럼, 당신의 버튼의 구현 코드의 끝 부분에 인수없이) (적용 사용 함수 안에있는 코드 (즉, $ apply에 대한 매개 변수로 전달 된 함수)가 함수가 먼저 실행되고 함수가 끝나면 AngularJS는 $ digest()를으로 호출합니다. $에 대한 자세한 내용은 모든 시계 감시 값의 변화에 ​​대한 점검 오 ..

$scope.toggleFollow = function (userId) { 

    //Call $apply() ,passing the function as parameter 
    $scope.$apply(function(){ 
     if (element == -1) { 

      //...your button's implementation code 

     } 
     else if (element >= -1) { 

      //....your button's implementation code 

     } 
    }); 
} 

는 this 문서를 참조하십시오 적용됩니다. 그것은 당신에게 더 나은 이해와 작업을 줄 것입니다.

희망이 도움이됩니다.

건배