programing

angular: 모델의 부울 값을 기반으로 버튼 텍스트를 전환합니다.

css3 2023. 3. 16. 21:42

angular: 모델의 부울 값을 기반으로 버튼 텍스트를 전환합니다.

부울 값을 기반으로 버튼 요소의 텍스트를 변경하는 간단한 방법은 무엇입니까?

유사 코드:

<button> some text OR some other text </button>

읽었어요.식에서의 Angularjs if-then-else 구조

ng-switch에 대해서는http://http://docs.angularjs.org/api/ng.directive:ngSwitch 를 참조해 주세요.

둘 다 모델의 Bool 값을 사용하여 작동하지 않는 것 같습니다.

다음과 같이 사용해야 합니다.

<button> {{ cond_vall == true ? 'Case 1' : 'Case 2' }}</button>

보여주려는 글에 따라 다르겠죠?컨트롤러 내의 텍스트를 제어할 수 있는 경우 텍스트를 스코프 변수에 바인드하여 컨트롤러에 설정할 수 있으므로 뷰에 논리를 넣을 필요가 없습니다.예를 들어 다음과 같습니다.

<button>{{someScopeVarWithYourString}}</button>

그렇지 않으면 부울 조건으로 ng-if 또는 ng-show를 사용할 수 있습니다.

<button ng-show="someBoolValue">some text</button>
<button ng-show="!someBoolValue">some other text</button>

버튼 텍스트에 필터(변환 필터)를 사용해야 했기 때문에 다음 솔루션이 가장 효과적이었습니다.

<button>
    <span> {{ condition ? 'some_text' : 'some_Other_text' | translate }}</span>
</button>

조합할 때 필요한 것은 괄호뿐인 것 같습니다.Angular 8 LTS,Typescript 3.5그리고.ngx-bootstrap

<button type="button" class="btn"> {{ ( boolVar ? 'text' : 'other text')  | translate }} </button>

                                            
<div ng-app="myModule">
  <div ng-controller="myController">
    {{message}} <br />
    <button ng-click="changeMessage(message)">Change Message</button>
  </div>
</div>

var module = angular.module("myModule", []);
module.controller("myController", function($scope) {
$scope.message = "Hello World";
  $scope.changeMessage = function(value) {
  if(value==="Hello World"){
  $scope.message = "Hello Universe!";
  }else{
    $scope.message = "Hello World";
  }

  };
});

언급URL : https://stackoverflow.com/questions/21440288/angular-toggle-text-of-button-based-on-boolean-value-in-model