可以在Angular JS的组件中插入多个函数吗？

Question

我有一个angular js的组件。

 app.component('phoneDetail', {
     templateUrl: 'new.html',
     controller: ['$http','$routeParams',
       function PhoneDetailController($http,$routeParams) {
         var valueX = this;


         $http.get('http://angular.github.io/angular-phonecat/step-7/app/phones/'+ $routeParams.valueX + '.json').then(function(response){
            valueX.phone = response.data;
         });
       }]
 });

我需要插入另一个函数，比如onclick()

 $scope.littleSize = false;

 $scope.toggleSize = function() {
     $scope.littleSize = !$scope.littleSize;

是否可以在此组件上插入内部，或者我必须创建另一个组件？谢谢。

Answer 1

您可以将任意多的功能放入控制器中。这取决于你以一种有意义的方式将它们分开。

所以这是可以的：

app.component('phoneDetail', {
     templateUrl: 'new.html',
     controller: ['$http','$routeParams',
       function PhoneDetailController($http,$routeParams) {
          var controller = this;
          $http.get('http://angular.github.io/angular-phonecat/step-7/app/phones/'+ $routeParams.valueX + '.json').then(function(response){
            controller.phone = response.data;
          });
          controller.onClick = function() { console.log("I am clicked"); }
     }]
});

new.html

<div>
    <span>{{ $ctrl.phone }}</span>
    <button ng-click="$ctrl.onClick()">Click me</button>
</div>

我希望我的问题是正确的。