1

I have two functions with same name "chiliClick". The uncommented function is not invoking even after hitting the button chili nor is it throwing any error in console. However the same function (commented) working fine with same code. Is there any difference? Please help

(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>

What are the differences between the declarations of function "chiliClick"?

4

2 回答 2

0

是的！有很大的不同。

因为在您的评论功能中，您写道：

$scope.chiliClick = ...

执行此操作时，您将函数提供给范围，以便您的 HTML 知道该chiliClick函数。

但是当你像未注释的那样做时，你的 HTML 对函数一无所知（因为它是局部变量，在你的控制器函数中声明）。

于 2015-07-05T22:39:38.820 回答
0

第一个创建一个局部函数。

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

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

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

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

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

于 2015-07-05T22:40:14.117 回答