함수에서 $ scope 변수를 변경하지 못했습니다.

Question

사용자가 navbar에서 선택할 수있는 다른 테마를 가진이 앱을 가지고 있습니다. 이 시점에서 변수를 false에서 true로 변경하려고합니다. 여기

내가 탐색을 위해 일하고 있어요 코드입니다 :

<li> 
     <a ng-click="toggleTheme(blackWhite)"> Black and White theme</a> 
    </li> 

여기 컨트롤러의 코드입니다.

$scope.blackWhite = false; 
//other themes are false 
$scope.toggleTheme = function(theme){ 
theme = !theme; 
console.log($scope.blackWhite);//its still false 
} 

어떻게하면됩니까? 감사합니다

Answer 1

이 잘 작동합니다 :

<li> 
    <a ng-click="toggleTheme('blackWhite')">Black and White theme</a> 
</li> 

컨트롤러

$scope.blackWhite = false; 

$scope.toggleTheme = function(theme){ 
    $scope[theme] = !$scope[theme]; 
} 

당신은 당신의 기능에 직접 blackWhite 또는 기타 변수를 설정할 필요가 없습니다. 가능한 한 많이 분리 해두는 것이 가장 좋습니다.

Answer 2

실제로 $ scope.blackWhite에 대한 참조가 아닌이 함수에 $ scope.blackWhite의 값을 전달하고 있습니다. 그래서 당신은 다음과 같이 새로운 값으로 $ 범위 변수를 업데이트해야합니다

$scope.toggleTheme = function(theme) { 
    $scope.blackWhite = !theme; 
} 

또는, 당신은 단지 부울 값을 전환하고 있기 때문에 더 나은 아직, 모든 변수를 전달하지 않습니다

$scope.toggleTheme = function() { 
    $scope.blackWhite = !$scope.blackWhite; 
} 

그런 다음 마크 업은 다음과 같습니다 대신 그것을 참조하는 문자열을 전달하면

가

<a ng-click="toggleTheme()">Black and White theme</a>