2016-12-29 7 views
0

Angular JSを初めて使用しています。最初のエントリの「削除アイコン」を無効にするコードがあります。最初のエントリは "英語"です。角度jsの最初のエントリの削除アイコンを無効にする

リストには、英語、中国語、ドイツ語などのデータが含まれています。削除アイコンは他の言語用に配置されますが、最初のエントリである英語用に無効にする必要があります。以下は

はhtmlコードです:

<div class="row"> 
       <div class="form-group "> 
        <label class="form-group col-md-3">Language</label> 
        <label class="form-group col-md-4">Title</label> 
        <label class="form-group col-md-5"> Description</label> 
       </div> 
      </div> 
<div class="row"> 
    <div> 
         <div ng-repeat="Descriptions in mainsWithDescription "> 
          <div class="form-group col-md-2 top-Margin-language"> 
           <label ng-model="Descriptions.Language">{{Descriptions.Language}}</label> 
          </div> 
          <div class="form-group col-md-4 top-Margin-Title"> 
           <input type="text" class="form-control input-md" name="titleValidate[]" ng-model="Descriptions.Title" /> 

          </div> 
          <div class="form-group col-md-5">        
           <textarea maxlength="500" class="form-control input-md noresize" name="descriptionValidate[]" noresize ng-model="Descriptions.Description"></textarea> 
          </div> 
          <div class="form-group col-md-1"> 
           <a style="cursor:pointer"><img ng-src="{{DeleteIcon_url}}" alt="delete image" ng-click="($index == !selectedDeleteIcon) || mainsWithDescription.splice($index,1)" ng-class="{'disabled': ($index == !selected)}" /> </a> 
          </div> 
         </div> 
        </div> 
       </div> 

この問題を解決する方法は?英語が最初に常にある場合 おかげ

答えて

1

は、自動的にngRepeatによって作成され$firstスコープ変数を使用することができます。

<a style="cursor:pointer"><img ng-src="{{DeleteIcon_url}}" alt="delete image" ng-click="($index == !selectedDeleteIcon) || mainsWithDescription.splice($index,1)" ng-class="{'disabled': $first}" /> </a> 

別のオプションは、Descriptions.Languageを使用してenglishと比較されます。

<a style="cursor:pointer"><img ng-src="{{DeleteIcon_url}}" alt="delete image" ng-click="($index == !selectedDeleteIcon) || mainsWithDescription.splice($index,1)" ng-class="{'disabled': Descriptions.Language == 'English'}" /> </a> 
-1

ループ

または

<div ng-repeat="Descriptions in mainsWithDescription "> 
          <div class="form-group col-md-2 top-Margin-language"> 
           <label ng-model="Descriptions.Language">{{Descriptions.Language}}</label> 
          </div> 
          <div class="form-group col-md-4 top-Margin-Title"> 
           <input type="text" class="form-control input-md" name="titleValidate[]" ng-model="Descriptions.Title" /> 

          </div> 
          <div class="form-group col-md-5">        
           <textarea maxlength="500" class="form-control input-md noresize" name="descriptionValidate[]" noresize ng-model="Descriptions.Description"></textarea> 
          </div> 
          <div class="form-group col-md-1"> 
           <a style="cursor:pointer"><img ng-src="{{DeleteIcon_url}}" alt="delete image" ng-click="($index == !selectedDeleteIcon) || mainsWithDescription.splice($index,1)" ng-disabled="{{Descriptions.Language}}=='English'" ng-class="{'disabled': ($index == !selected)}" /> </a> 
          </div> 
         </div> 
+0

<a style="cursor:pointer" ng-if="!$first"><img ng-src="{{DeleteIcon_url}}" alt="delete image" ng-click="($index == !selectedDeleteIcon) || mainsWithDescription.splice($index,1)" ng-class="{'disabled': ($index == !selected)}" /> </a> 

をそれ以外の場合、このようにそれを無効にしますか?このソリューションで何が問題になっていますか? –

0

がNGリピート指令があればtrueと評価されている最初の$をプロパティを呼びかけている前に、あなたはそれを置く、ループの外に英語を保つことができます最初の行です。一緒にそれを使用して、NG-場合、私はこのように、それが表示されていないことを好むよう:なぜ-1

<a style="cursor:pointer"><img ng-src="{{DeleteIcon_url}}" alt="delete image" ng-click="($index == !selectedDeleteIcon) || mainsWithDescription.splice($index,1)" ng-class="{'disabled': $first}" /> </a> 
関連する問題