0

我是 AngularJS 的新手,我试图在单击按钮时隐藏 div。我正在做的工作正常,直到我将按钮放在我试图隐藏的 div 中(按钮使用不同的控制器)。当从控制器中取出时,该按钮按预期工作,所以我认为这是范围的问题。任何帮助,将不胜感激。

<form action="" name="signUpForm" class="heroForm" >
      <div ng-hide="signUpB">
            <span id="signUpFormA">
                  <input required type="email" /> 
                  <input required type="password"/>
                  <span ng-controller="checkEmailCtrl">
                        <input type="button" ng-click="signUpB=true">
                  </span>
            </span>
      </div>
      <div ng-show="signUpB">
            <span id="signUpFormB">
                  <input required type="text">
                  <input required type="text">
                  <input type="submit">
            <span>
      </div>
</form>
4

2 回答 2

0

ng-controller创建自己的范围。因此,ng-click="signUpB=true"在这个新范围内,您正在修改 signUpB。

您可以通过使用对象来保存 signUpB 的状态来解决此问题。基本上,将所有出现的 signUpB 替换为 state.signUpB。并且,在您的外部控制器范围内定义状态对象。

$scope.state = {signUpB: false // defaults to false}

更好的方法是使用controllerAs语法。假设您的外部控制器是OuterController. 您将其定义为

ng-controller="OuterController as outerCtrl"

和,

替换所有出现的signUpBwithouterCtrl.signUpB以确保您正在使用/修改 outerCtrl 的模型。

于 2016-02-13T22:01:01.460 回答
0

是的,您正在signUpB=true设置checkEmailCtrl. 你可以这样做:

<form action="" name="signUpForm" class="heroForm" ng-init="signUpB={value:false}">
      <div ng-hide="signUpB.value">
            <span id="signUpFormA">
                  <input required type="email" /> 
                  <input required type="password"/>
                  <span ng-controller="checkEmailCtrl">
                        <input type="button" ng-click="signUpB.value=true">
                  </span>
            </span>
      </div>
      <div ng-show="signUpB.value">
            <span id="signUpFormB">
                  <input required type="text">
                  <input required type="text">
                  <input type="submit">
            <span>
      </div>
</form>

通过将 包装signUpB在一个对象中,该signUpB.value=true语句将在外部范围内查找该signUpB对象,并将其value属性设置为 true,不会对checkEmailCtrl' 范围进行任何修改。

于 2016-02-13T22:01:22.457 回答