在AngularJs中使用多个函数

时间:2015-06-20 04:47:39

标签: javascript angularjs

我是角色的新手,并使用函数来加载使用$ http的数据,这对我有用。之后我决定做一些表单验证来查看它的行为。我可以单独完成,但有点混淆我如何将我的代码与上面的代码合并,以便我的两个函数都能很好地工作。 代码如下:

    var App = angular.module('App', []);

App.controller('DataCtrl', function($scope, $http) {
  $http.get('any url or file')
    .then(function(result) {

      $scope.data = result.data;


    });
});

控制器在body属性中定义如下:

<body ng-controller="DataCtrl">

现在当我把另一个函数放在同一个app.js文件中时,它不起作用,任何人都可以帮我解决这个问题,验证代码是这样的:

    App.controller('DataCtrl', function($scope) {
      $scope.submitForm = function(isValid) {

    if (isValid) {
      alert('submitting data');
    }
  };

});

我唯一需要做的就是让它们像这样工作: 1.加载数据(工作) 2.借助第二个代码块实现验证。

2 个答案:

答案 0 :(得分:3)

试着解释这件事是如何运作的:)

当浏览器遇到此行<body ng-controller="DataCtrl">时,它将寻找使用角度js注册的控制器的定义。 但在你的情况下,我猜你是两次注册控制器,如

<强>第一

App.controller('DataCtrl', function($scope, $http) {
  $http.get('any url or file')
    .then(function(result) {

      $scope.data = result.data;


    });
});

<强> SECOND

 App.controller('DataCtrl', function($scope) {
      $scope.submitForm = function(isValid) {

    if (isValid) {
      alert('submitting data');
    }
  };

});

因此,其中一个定义会根据脚本文件中存在的已注册方法的顺序覆盖另一个定义。

因此,要解决此问题,您只需使用一个已注册的控制器: -

 App.controller('DataCtrl', function($scope, $http) {
     $http.get('any url or file').then(function(result) {

         $scope.data = result.data;


     });

      $scope.submitForm = function(isValid) {

          if (isValid) {
              alert('submitting data');
           }
      };
 });

代码信用: - S Vinesh

答案 1 :(得分:2)

只需使用如下

 var App = angular.module('App', []);

 App.controller('DataCtrl', function($scope, $http) {
     $http.get('any url or file').then(function(result) {

         $scope.data = result.data;


     });

      $scope.submitForm = function(isValid) {

          if (isValid) {
              alert('submitting data');
           }
      };
 });