2017-10-19 13 views
-3

ボタンのタイトル属性を使用してボタン上にツールヒントを表示しています。ボタンの色の変化に合わせてツールチップを変更したい(ボタンの色を変えたまま、ボタンの色を変えて色を変える)次のような方法を使いました。しかし、それは動作しませんでした。私は角度jを使用しています。これをどうすれば解決できますか?HTMLボタンタグ内にif-else条件を書き込む方法は?

<button type="button" ng-click="vm.sortBy()" class="btn change- 
    button-color-{{vm.isColorChanged}} btn-circle btn-xs " 
    title="({{vm.isColorChanged}}==1) ? Test 1: Test 2" 
           data-toggle="modal"> 

    <strong >Sort</strong>--> 
</button> 

答えて

1

このような式を使用します。

title="{{ vm.isColorChanged == 1 ? 'Test 1': 'Test 2'}}" 
2

ng-attr-title="{{ vm.isColorChanged == 1 ? 'Test 1': 'Test 2'}}"を使用してください。 ng-attr-titleは動的属性を設定します。

var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function ($scope) { 
 
    var _self = this; 
 
    _self.isColorChanged = 1; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl as vm"> 
 

 
    <button type="button" ng-click="vm.sortByCutoffs()" 
 
      class="btn change-button-color-{{vm.isColorChanged}} btn-circle btn-xs " 
 
      ng-attr-title="{{ vm.isColorChanged == 1 ? 'Test 1': 'Test 2'}}" 
 
      data-toggle="modal"> 
 

 
     <strong>Sort</strong> 
 
    </button> 
 
</div>

関連する問題