web-dev-qa-db-ja.com

Angularjs if / elseステートメント

<div class="company_name" ng-controller="CompanyName">
 <h1 class="left">
     {{data.company_name}}
 </h1>
</div>

私がやりたいのは、data.company_nameが入力フィールドを介して追加されていない場合、プレースホルダ「会社名」が表示されるようにすることです。angularjsを使用してどのようにできますか？

angularjsconditional-statements
9
Xeen

ng-if を使用して、次のようなことができます

<div class="company_name" ng-controller="CompanyName">
 <h1 class="left">
     <span ng-if="data.company_name === ''">
       // Some placeholder
     </span>
     <span ng-if="data.company_name !== ''">
       {{data.company_name}}
     </span>
 </h1>
</div>

BTW ngIfはv1.1.5で追加された新しいディレクティブであるため、angularバージョンをアップグレードする必要があるかもしれません

ここに私の配管工を参照してください： http://plnkr.co/edit/qiN2XshEpay6e6zzhUKP

29
Nicolas ABRIC

プロジェクトでng-if、ng-else-if、およびng-elseを使用するには、次を使用します。

https://github.com/zachsnow/ng-Elif

1
Aqib Mumtaz

コードをクリーンに保つ1つの方法は、フィルターを使用することです。このコードは、アクティブなタブにクラスを追加します。

var filters = angular.module('filters');
filters.filter('ie', function(){
  return function(v, yes, no){
      return v ? yes : no;
  };
});

テンプレート

<li class="{{activeTab == 'home' | ie: 'active-class':''}}">
    Home
</li>
1
Kristo Aun

チェック会社名vlaueに ng-if 条件を使用できます。例を見てみましょう

 <span ng-if="driver.status_flag == 1">
    <i ngif="{{driver.status_flag}}" class="icon-ok-sign icon-2x link" style="color:#090" href="#" title="Payment received" ></i>
 </span>

上記の例では、status_flagの値が1である場合、内側のスパン値が表示されます。あなたの場合と同じように、次のようなステートメントを追加できます

<span ng-if="data.company_name === ''">
        <i ngif="{{driver.status_flag}}" class="icon-ok-sign icon-2x link" style="color:#090" href="#" title="Payment received" ></i>
     </span>
0
Nikunj K.