AngularJS |控制器

AngularJS控制器在AngularJS应用程序中起着重要作用。所有AngularJS应用程序主要依靠控制器来控制该应用程序中的数据流。基本上，它控制的AngularJS应用程序和控制器的数据是Javascript对象，通过标准JavaScript对象构造器创建的。

ng-controller指令定义了应用程序控制器。在AngularJS中，控制器由Javascript构造函数定义，并且在定义控制器并返回$ scope.firstname和$ scope.lastname的串联时，将使用AngularJS范围和$ scope)函数定义控制器。

句法：

Contents...

示例：此示例使用ng-controller指令显示用户的First和Second输入的串联。

  

    ng-controler Directive
  
    
    
  
    
        var app = angular.module('myApp', []);
        app.controller('myCtrl', function($scope) {
            $scope.firstName = "Geeks";
            $scope.lastName = "Geeks";
        });
    
  


  
    
        GeeksforGeeks
        ng-controler Directive
        
  
            First Name:
            
             Last Name:
            
            
             Full Name: {{firstName + "for" + lastName}}
  
        
  
    

  

输出：

控制器方法

第一个示例演示了一个具有两个属性的控制器对象：Fname和Lname。在AngularJS中，函数($ scope)是在定义控制器时定义的，并返回$ scope.firstname和$ scope.lastname的串联。在这里，控制器也可以具有方法(变量作为函数)：

例子：

  

    ng-controler Directive
  
    
    
  
    
        var app = angular.module('geeks', []);
        app.controller('personCtrl', function($scope) {
  
            $scope.fullName = function() {
                return $scope.firstName + " " + $scope.lastName;
            };
        });
    
  



    
        GeeksforGeeks
        ng-controler Directive First Name:
        
         Last Name:
        
        
         Full Name: {{fullName()}}
    


                    

输出：
在写名字之前：

写下名字后：

外部文件中的控制器

在较大的应用程序中，通常将控制器存储在一个外部文件中，您只需要复制该文件nime并将其粘贴到        

      

GeeksforGeeks

      

ng-controler Directive

               

          First Name:           
          Last Name:           

          Full Name: {{fullName()}}       

   

输出：