Angularjs仅在其他输入不为空时才显示元素

时间:2014-03-10 13:10:19

标签: forms angularjs

有没有办法只在输入不为空时显示dom元素?除了有效和肮脏等其他限制之外。

这是我现在的标记:

<div class="form-group user-config">
    <label for="upassword" class="col-sm-3 control-label">Parola</label>
    <div class="col-sm-9 form-control-static">
        <button data-ng-show="!formShowChangePassword" type="button" class="btn btn-xs btn-default" data-ng-click="showChangePassword()">Modifica Parola</button>
        <div data-ng-show="formShowChangePassword" class="right-inner-addon">
            <i data-container="body" data-toggle="tooltip" data-placement="top" title="Parola trebuie sa aiba cel putin 8 caractere si sa contina litere mari si mici precum si cifre" data-ng-show="userConfigSettingsForm.upassword.$dirty && userConfigSettingsForm.upassword.$invalid" class="fa fa-fw fa-exclamation-circle input-error-icon"></i>
            <input data-ng-blur="formCheckEmptyPassword($event)" data-ng-minlength="8" data-ng-pattern="/^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,255}$/" data-ng-required="formDbData.UserId == 0" class="form-control input-sm" name="upassword" id="upassword" placeholder="Parola" data-ng-model="formDbData.Password">
        </div>
    </div>
    <div data-ng-show="userConfigSettingsForm.upassword.$valid && userConfigSettingsForm.upassword.$dirty && formShowChangePassword" class="col-sm-12 form-control-static" style="overflow: hidden;">
        <label class="col-sm-6 control-label pull-left label-trimite-email">Trimite email catre</label>
        <div class="col-sm-6 pull-right form-control-static">
            <div class="btn-group">
                <button type="button" class="btn btn-xs btn-default" ng-model="formSendEmail.user" btn-checkbox>User</button>
                <button type="button" class="btn btn-xs btn-default" ng-model="formSendEmail.admin" btn-checkbox>Administrator</button>
            </div>
        </div> 
    </div>
  </div>

我希望div.form-group中的第二个div仅在upassword输入有效,脏且不为空时显示。到目前为止,它适用于第一个2.我试图检查模型(formDbData.Password),但除非输入有效,否则不会更新

如果输入为空,则formCheckEmptyPassword函数只是将formShowChangePassword更改为false。 showChangePassword()也将其更改为true。

1 个答案:

答案 0 :(得分:0)

<{1}} AND输入字段不为空时,

formDbData.Password不为空。

因此,您可以像这样简化逻辑:

userConfigSettingsForm.upassword.$valid

但我认为您需要的是删除<div data-ng-show="userConfigSettingsForm.upassword.$dirty && formDbData.Password" 条件

userConfigSettingsForm.upassword.$valid

DEMO

相关问题