角js第二控制器不工作

时间:2016-01-09 18:59:27

标签: javascript angularjs

我在我的模块中定义的第二个控制器(RegisterController)有问题。第一个工作正常。 我在名为user.js的文件中有2个控制器

var app = angular.module("User", []);
app.controller('LoginController', ['$scope', '$http',
  function($scope, $http) {
    $scope.user = {
      email: 'bbb@ccc.com',
      password: '',
      username: 'sex',
    };
    $scope.login = function() {
      return $http.post('http://localhost/cw/index.php/rest/resource/user/action/login', $scope.user).then(function successCallback(response) {
        if (response.data.success == 'true') {

        }

      }, function errorCallback(response) {

      });;

    }

  }
]);
app.controller('RegisterController', ['$scope', '$http',
  function($scope, $http) {
    $scope.user = {
      email: 'abc@123.com',
      password1: 'lol',
      password2: '',
      username: 'blah',
      profile_picture: '',
      dobDay: '',
      dobMonth: '',
      dobYear: '',
    };
    $scope.submit = function() {
      alert("submit");

    }
  }
]);
我的HTML看起来像这样

<table>
  <tr>
    <td>
      <span>
                        <table style="text-align: right" ng-app="User" ng-controller="LoginController">
                            <tr>
                                <td>
                                    Email
                                </td>
                                <td>
                                    <input type="text" ng-bind="user.email" ng-model="user.email">
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Password
                                </td>
                                <td>
                                    <input type="password" ng-bind="user.password" ng-model="user.password">
                                </td>    
                           </tr>
                           <tr>
                               <td></td>
                               <td style="float:left">
                                    <button ng-click="login()">login</button>
                               </td>
                           </tr>
                        </table>
                    </span>

    </td>

    <td>
      <div style="border-left:1px solid">
        <table style="text-align: left" ng-app="User" ng-controller="RegisterController">
          <tr>
            <td>
              Username
            </td>
            <td>
              <input type="text" ng-bind="user.username" ng-model="user.username">
            </td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td>
              Email
            </td>
            <td>
              <input type="email" ng-bind="user.email" ng-model="user.email">
            </td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td>
              Password
            </td>
            <td>
              <input type="text" ng-bind="user.password1" ng-model="user.email">
            </td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td>
              Retype password
            </td>
            <td>
              <input type="text" ng-bind="user.password2" ng-model="user.password">
            </td>
            <td>&nbsp;</td>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td>
              Date of Birth
            </td>
            <td>
              <input type="text" ng-bind="user.dobDay" ng-model="user.password" value="DD" size="2" maxlength="2">
              <input type="text" ng-bind="user.dobMonth" ng-model="user.password" value="MM" size="2" maxlength="2">
              <input type="text" ng-bind="user.dobYear" ng-model="user.password" value="YYYY" size="4" maxlength="4">
            </td>
          </tr>
          <tr>
            <td>
              Profile picture
            </td>
            <td>
              <input type="file" ng-bind="profile_picture">

            </td>
          </tr>
          <tr>
            <td></td>
            <td style="float:left">
              <button ng-click="submit()">Submit</button>
            </td>
          </tr>
        </table>
      </div>
    </td>

  </tr>

</table>

即使按钮单击也没有任何作用。这里有什么问题? 我是Angular js的新手。任何帮助表示赞赏。

1 个答案:

答案 0 :(得分:1)

  • 插入您的ng-app="User" inot表元素
    • 删除其他ng-app="User"个实例。
    • 您只能定义ng-app一次,因为不使用控制器。

&#13;
&#13;
var app = angular.module("User", []);
app.controller('LoginController', ['$scope', '$http',
  function($scope, $http) {
    $scope.user = {
      email: 'bbb@ccc.com',
      password: '',
      username: 'sex',
    };
    $scope.login = function() {
      return $http.post('http://localhost/cw/index.php/rest/resource/user/action/login', $scope.user).then(function successCallback(response) {
        if (response.data.success == 'true') {

        }

      }, function errorCallback(response) {

      });;

    }

  }
]);
app.controller('RegisterController', ['$scope', '$http',
  function($scope, $http) {
    $scope.user = {
      email: 'abc@123.com',
      password1: 'lol',
      password2: '',
      username: 'blah',
      profile_picture: '',
      dobDay: '',
      dobMonth: '',
      dobYear: '',
    };
    $scope.submit = function() {
      alert("submit");

    }
  }
]);
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="User">

  <table>
    <tr>
      <td>
        <span>
                        <table style="text-align: right"  ng-controller="LoginController">
                            <tr>
                                <td>
                                    Email
                                </td>
                                <td>
                                    <input type="text" ng-bind="user.email" ng-model="user.email">
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    Password
                                </td>
                                <td>
                                    <input type="password" ng-bind="user.password" ng-model="user.password">
                                </td>    
                           </tr>
                           <tr>
                               <td></td>
                               <td style="float:left">
                                    <button ng-click="login()">login</button>
                               </td>
                           </tr>
                        </table>
                    </span>

      </td>

      <td>
        <div style="border-left:1px solid">
          <table style="text-align: left" ng-controller="RegisterController">
            <tr>
              <td>
                Username
              </td>
              <td>
                <input type="text" ng-bind="user.username" ng-model="user.username">
              </td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td>
                Email
              </td>
              <td>
                <input type="email" ng-bind="user.email" ng-model="user.email">
              </td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td>
                Password
              </td>
              <td>
                <input type="text" ng-bind="user.password1" ng-model="user.email">
              </td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td>
                Retype password
              </td>
              <td>
                <input type="text" ng-bind="user.password2" ng-model="user.password">
              </td>
              <td>&nbsp;</td>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td>
                Date of Birth
              </td>
              <td>
                <input type="text" ng-bind="user.dobDay" ng-model="user.password" value="DD" size="2" maxlength="2">
                <input type="text" ng-bind="user.dobMonth" ng-model="user.password" value="MM" size="2" maxlength="2">
                <input type="text" ng-bind="user.dobYear" ng-model="user.password" value="YYYY" size="4" maxlength="4">
              </td>
            </tr>
            <tr>
              <td>
                Profile picture
              </td>
              <td>
                <input type="file" ng-bind="profile_picture">

              </td>
            </tr>
            <tr>
              <td></td>
              <td style="float:left">
                <button ng-click="submit()">Submit</button>
              </td>
            </tr>
          </table>
        </div>
      </td>

    </tr>

  </table>

</div>
&#13;
&#13;
&#13;