ng隐藏&ng显示不能仅在特定的AngularJS页面中工作

对于设备的详细信息视图页面Im正在构建，我使用了Angular的ng-show和ing-hide指令来根据设备状态颜色更改按钮显示。我使用｛｛item.transaction_Mode｝｝从数据库中获取颜色。Angular部分似乎可以正确输出"true"answers"false"，但当它与ng show（如ng show="true"）组合时，它就不起作用了。

HTML代码：-

颜色生成部分-

<div  style="width: 30%; float: left">
                    <div ng-show="{{item.transaction_Mode == 'red'}}" class="col s1 m1 l1 vertical-line" style="height: 100%;width: 10px; background-color: red;float: left; " > </div>     
                    <div ng-show="{{item.transaction_Mode == 'orange'}}" class="col s1 m1 l1 vertical-line" style="height: 100%;width: 10px; background-color: orange;float: left; " > </div>     
                    <div ng-hide="{{item.transaction_Mode == 'red'}} || {{item.transaction_Mode == 'orange'}}" class="col s1 m1 l1 vertical-line" style="height: 100%;width: 10px; background-color: green;float: left; " > </div>     
                    <h1  style="text-align: left">{{devices[whichItem].name}} - [id  {{devices[whichItem].device_ID}}] </h1>
</div>

根据颜色部分的按钮显示-

<div  style="width: 70%; float: left; "> 

                   <button ng-hide="{{item.transaction_Mode == 'red'}} || {{item.transaction_Mode == 'orange'}}" style="margin-top:  20px; width: 17%; float: left; height: 46px;" type="button" data-target="modal1" class="Now waves-effect waves-light btn modal-trigger" >Now</button>
                    <p style="width: 3%; float: left"> </p>
                    <button  style="margin-top:  20px; width: 17%; float: left; height: 46px;" type="button" data-target="modal2" class="Later waves-effect waves-light btn modal-trigger ">Later</button>
                    <p style="width: 3%; float: left"> </p>
                    <button ng-show="{{item.transaction_Mode == 'orange'}}" style="margin-top:  20px; width: 17%; float: left; height: 46px;" type="button" class="waves-effect waves-light btn " >Get</button>
                    <p style="width: 3%; float: left"> </p>
                    <button ng-show="{{item.transaction_Mode == 'orange'}}" style="margin-top:  20px; width: 17%; float: left; height: 46px; " type="button" data-target="modal4" class="Cancel waves-effect waves-light btn modal-trigger" >Cancel</button>
                    <p style="width: 3%; float: left"> </p>
                    <button ng-show="{{item.transaction_Mode == 'red'}}" style="margin-top:  20px; width: 17%; float: left; height: 46px; " type="button" data-target="modal3" class="Return waves-effect waves-light btn modal-trigger" >Return</button>
</div>

但同样的代码适用于另外两页，我不明白为什么它不适用。ng if或ng开关when也不起作用。任何帮助都将不胜感激，提前感谢！