Question

我是Angular 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>

如何解决这个问题？感谢

Answer 1

如果始终是英语，您可以使用由$first自动创建的ngRepeat范围变量。

<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>

Answer 2

ng-repeat指令有一个名为$ first的属性，如果它是第一行，则计算结果为true。将它与ng-if一起使用，因为我不喜欢它，如下所示：

<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>

否则，请按以下方式禁用它：

<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>

Answer 3

你可以让英语脱离循环，把它放在循环之前

或

public class Mocha extends CondimentDecorator {
    public Mocha(Beverage beverage) {
        super(beverage);
    }

    @Override
    public String getAdditionName() {
        return "Mocha";
    }

    @Override
    public double getAdditionCost() {
        return 0.20;
    }
}

禁用角度js

3 个答案: