web-dev-qa-db-ja.com

* ngIfの関数を呼び出す

この状況で、正しいHTMLマークアップを表示する関数を呼び出したいと思います。これが私の現在のコードです：

<li ng-repeat="data in myBlock.myData">
    <div ng-if="data.type=='Jonh'">
       <div class='row'>
          <div class='col'>
           this is text for Jonh
          </div>
      </div>
    </div>
    <div ng-if="data.type=='Roy'">
      <div class='row'>
         <div class='col'>
           Roy will have a different text
        </div>
      </div>
    </div>
    <div ng-if="data.type=='Kevin'" > 
       <div class='row'>
          <div class='col'>
            Kevin text is also different
          </div>
       </div>
    </div>
</li>

すべてのngifを「showField（name）」と呼ばれる関数に組み合わせて、正しいHTMLマークアップをチェックして返すようにしたいと思います。どうすればそれができますか？最終的なHTMLマークアップは次のようになります。

<li ng-repeat="data in myBlock.myData">
   <div *ngIf="showField(data.type)">
      //Not sure how to implement this part
   </div>                       
</li>
angularjsangular-ng-if
3
loveprogramming

HTML：

<li ng-repeat="data in myBlock.myData">
   <div ng-if="checkValidDataType(data.type)">
       <div class='row'>
          <div class='col'>
             <label class='title' for="{{data.name}}">{{data.label}}</label>
             <span class="{{data.type.toLowerCase() + 'Class'}}">This is {{data.type}}</span>                 
          </div>
      </div>
   </div>                       
</li>

JS：

$scope.checkValidDataType = function(type) {
    return type === "Roy" || type === "Kevin" || type === "Jonh";
}
4
Sachet Gupta

あなたが達成しようとしていることは正しい方法です、コントローラ内でメソッドを宣言してブール値を返すだけです

$scope.showField = function(yourdata){
   //put the logic
   return true/false;
}
1
Sajeetharan