在我的控制器中，我有一个名为 "chiliClick" 的函数。为什么不调用？

Question

我有两个同名的函数"chiliClick"。即使在按下按钮 chili 之后，未注释的函数也不会调用，也不会在控制台中抛出任何错误。但是，相同的功能（已注释）可以使用相同的代码正常工作。有什么不同吗？请帮忙

(function(){

  var app = angular.module("myApp", []);

  var clickController = function($scope){

    $scope.spicy = 'very';

    function chiliClick(){
      $scope.spicy = 'chili';  
    }

    // $scope.chiliClick = function(){
    //   $scope.spicy = 'chili'; 
    // }

  };

  app.controller("clickController", clickController);

}());// Code goes here

    <!DOCTYPE html>
<html lang="en" ng-app="myApp">

  <head>
    <meta charset="UTF-8">
    <title>Hello Controller </title>

  </head>

  <body>

    <div ng-controller="clickController">
       <button ng-click="chiliClick()">Chili</button>
       <button>jalapeño</button>
       <p> this is {{spicy}} hot <p>
    </div>


     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.min.js"></script>
     <script src="myApp.js"></script>
  </body>

</html>

函数的声明有什么区别"chiliClick"？

Answer 1

是的！有很大的不同。

因为在你的注释函数中你写道：

$scope.chiliClick = ...

执行此操作时，您将函数提供给作用域，因此您的 HTML 知道 chiliClick 函数。

但是当你只是按照未注释的方式执行操作时，你的 HTML 对该函数一无所知（因为它是局部变量，在你的控制器函数中声明）。

Answer 2

第一个创建局部函数。

function chiliClick(){
    $scope.spicy = 'chili';  
}

这意味着它本质上是控制器范围内的本地对象。您可以在该范围内调用它，但您永远不会这样做。您可以认为这在概念上类似于其他语言中的 private 函数。

第二个创建一个函数作为 $scope 对象的属性。

$scope.chiliClick = function(){
   $scope.spicy = 'chili'; 
}

这次，您已将函数附加到angular 允许您调用的对象（$scope 对象）。您可以将其视为类似于 public 函数。

在我的控制器中，我有一个名为 "chiliClick" 的函数。为什么不调用？

In my controller I have function named "chiliClick". Why is it not invoking?

javascript

function

angularjs

ng-controller