source

ng-show가 트리거되면 함수를 호출하시겠습니까?

manysource 2023. 2. 12. 18:09

ng-show가 트리거되면 함수를 호출하시겠습니까?

ng-show에서 공개되는 내용으로 라이트박스를 보여주고 싶은데 라이트박스 JS를 트리거하는 방법을 모르겠습니다.저는 이런 걸 찾고 있어요

ng-on-show="showLightbox()"

ng-show가 묶여있는 당신의 모델을 $watch하는 것이 좋을 것 같습니다.

다음은 예를 제시하겠습니다.

<div ng-app="myApp" ng-controller="myCtrl" ng-init="isDisplayed = true">
    <div ng-show="isDisplayed">something</div>
    <button ng-click="isDisplayed = !isDisplayed">Toggle</button>
</div>

var myApp = angular.module('myApp', [])
.controller('myCtrl', function($scope, $log) {
    $scope.$watch('isDisplayed', function(newValue, oldValue) {
        if (newValue !== oldValue) {
            $log.log('Changed!');
        }
    });
});

만지작거리다

좀 더 간단한 접근은 어떨까요?

예를 들어 다음과 같은 요소가 있다고 가정합니다.

<div ng-show="someBooleanValue"></div>

displayMyDiv 후에 AND 연산자를 사용하여 콜백을 설정한 경우 첫 번째 값이 TRUE일 경우에만 콜백이 실행됩니다(논리 AND 연산자는 이렇게 작동합니다).각도 1.15.10을 사용해 다음과 같이 시도했습니다.이렇게 동작합니다.

$scope.showLightbox = function() {
  // your logic goes here
  return true;
}

<div ng-show="someBooleanValue && showLightbox()"></div>

일부 Boolean Value가 참인 경우에만 $scope가 됩니다.show Lightbox()도 평가됩니다.따라서 $scope를 만들어야 합니다.TRUE를 반환하려면 showLightbox()를 사용합니다.그렇지 않으면 div가 표시되지 않습니다.

이 방법은 단순할 뿐만 아니라 옵저버 구현을 angular(유지관리할 코드 감소)로 처리하며 콜백 반환은 일부 Boolean Value가 TRUE로 변경된 경우에만 평가됩니다.

음, ng-show는 부울값을 취하기 때문에 이 값을 사용하기 위한 최선의 옵션은 ng-show를 설정하는 로직 어딘가에 showLightbox 함수를 호출하는 것입니다.

$scope.reasonToShow = false;

$scope.showSomething = function(myCondition){
    if(myCondition){
        showLightbox();
        $scope.reasonToShow = true;
    }
};

<div ng-show='reasonToShow'></div>

필요하다면 $시계로도 비슷한 일을 할 수 있어요.

언급URL : https://stackoverflow.com/questions/21056037/call-a-function-when-ng-show-is-triggered