Question

我正在使用ng-if如果在单击按钮“添加”时显示一个表单但是它不起作用，我已经看过很多例子，我尝试了所有这些，但没有人为我工作。这可能是代码：

angular.module('myFormApp', [])
.controller('CustomerController', function ($scope, $http, $location, $window) {
    $scope.custModel = {
        shown : false
    };

    $scope.showform = function () {
        $scope.shown = true;
    }
});

<div id="content" ng-controller="CustomerController">
  <form name="frmCustomer" ng-show="custModel.shown"  >
            <div>
                <input type="hidden" ng-model="custModel.Id" name="cid" />
            </div>
            <div>
                <label for="email">Customer Name</label>
                <input type="text" ng-model="custModel.CustName" name="cname" placeholder="" required ng-minlength="4" ng-maxlength="14" />
                <span class="error" ng-show="(frmCustomer.$dirty||submitted) && frmCustomer.cname.$error.required">Customer name is Required</span>
                <span class="error" ng-show="frmCustomer.$dirty && frmCustomer.cname.$error.minlength">Minimum length required is 5</span>
                <span class="error" ng-show="frmCustomer.$dirty && frmCustomer.cname.$error.maxlength">Minimum length required is 15</span>
            </div>
            <div>
                <label for="email">E-mail address</label>
                <input type="email" ng-model="custModel.CustEmail" name="email" placeholder="" required />
                <span class="error" ng-show="(frmCustomer.$dirty ||submitted) && frmCustomer.email.$error.required">EmailId is Required!</span>
                <span class="error" ng-show="(frmCustomer.$dirty ||submitted) && frmCustomer.$error.email">Invalid EmailId!</span>
            </div>
            <div class="btn">
                <input type="submit" value="Save" ng-click="saveCustomer()" ng-disabled="frmCustomer.$invalid">
                <input type="submit" value="Update" ng-click="updateCustomer()" ng-disabled="frmCustomer.$invalid">
            </div>
        </form>

 <button type="submit" ng-click="showform()" class="btn btn-default">Add Customer</button>
      </div>

Answer 1

首先，改变

$scope.showform = function () {
    $scope.shown = true;
}

到

$scope.showform = function () {
    $scope.custModel.shown = true;
}

Answer 2

你错过了

$scope.custModel .shown = true;

https://plnkr.co/edit/eJDTTZ?p=preview

它会起作用。

ng-if不用于显示表单

2 个答案: