当前位置: 首页 > 面试题库 >

AngularJS:何时将$ scope变量传递给函数

松刚豪
2023-03-14
问题内容

我正在使用TodoMVC应用程序来更好地使用AngularJS框架。在第14-16行的index.html中,您将看到以下内容:

<form id="todo-form" ng-submit="addTodo()">
    <input id="new-todo" placeholder="What needs to be done?" ng-model="newTodo" autofocus>
</form>

注意 ng-submit 指令如何在不将 newTodo 模型作为参数传递的情况下调用 addTodo() 函数。 __

不久之后,我在第19行的同一文件中遇到了以下代码:

<input id="toggle-all" type="checkbox" ng-model="allChecked" ng-click="markAll(allChecked)">

您可以看到作者这次决定将 allChecked 模型传递给 markAll() 函数。如果我理解正确,他们可能在控制器内部引用了 $
scope.allChecked
而不是将其传入。

为什么要在同一文件中使用两种不同的方法?在某些情况下,一种方法更好吗?这是不一致的情况还是正在使用更深层的逻辑?


问题答案:

我希望始终将参数传递给该函数:

  • 函数可以清楚知道哪些参数。
  • 因为 所有参数都已注入到函数中 ,所以单元测试更容易。(适用于单元测试)

请考虑以下情况:

$scope.addToDo = function(){
   //This declaration is not clear what parameters the function expects.
   if ($scope.parameter1){
      //do something with parameter2
   }    
}

更糟糕的是:

$scope.addToDo = function(){
    //This declaration is not clear what parameters the function expects.
    if ($scope.someobject.parameter1){ //worse

    }    
}

由于作用域继承parameter2可能来自父作用域,因此parameter2在函数内部进行的访问会产生 紧密的耦合
,当您尝试对该函数进行单元测试时,也会引起麻烦。

如果我这样定义函数:

//It's clearer that the function expects parameter1, parameter2
$scope.addToDo = function(parameter1, parameter2){
   if (parameter1){
      //do something with parameter2
   }    
}

如果您parameter2是从父范围继承的,则仍可以从视图中将其传递。在进行单元测试时,很容易传递所有参数。

如果您曾经使用过ASP.NET
MVC,您会注意到类似的东西:该框架尝试将参数注入到动作函数中,而不是直接从对象RequestHttpContext对象中访问它。

万一其他人提到喜欢与 ng-repeat

我认为,角度控制器和模型并没有很清楚地分开。$
scope对象看起来像带有属性和方法的模型(模型也包含逻辑)。具有OOP背景的人们会认为:我们只传递不属于对象的参数。就像Person已经拥有的类一样hands,我们不需要hands为每个对象方法传递。这样的示例代码:

//assume that parameter1 belongs to $scope, parameter2 is inherited from parent scope.
    $scope.addToDo = function(parameter2){ 
        if ($scope.parameter1){ //parameter1 could be accessed directly as it belongs to object, parameter2 should be passed in as parameter.
            //do something with parameter2
        }   
    }


 类似资料:
  • 问题内容: doc中的示例: 但是,如果我需要使用这样的外部变量,该怎么办: 现在,我创建了新属性,并通过访问了它,但是还有其他更便捷的方法吗? 问题答案: 您可以使用关键字将必要的变量从父范围传递到闭包中。 例如: 在这里更多。 编辑(2019更新): PHP 7.4(将于2019年11月28日发布)引入了一种称为箭头函数的匿名函数的较短变体,这使得它的冗长程度有所降低。 使用PHP 7.4的示

  • 问题内容: 此代码无法正常工作。我想要的只是将变量发送到 正确的方法是什么?: 脚本 问题答案: myFile.php:

  • 我有以下Powershell代码: 我应该如何声明可以传递给函数的局部变量。我的局部变量$file被填充,但当我将其作为其他函数的参数时,它就像它超出了范围。 我读了关于scopes的文章,但没能弄明白。 当前我收到错误: ini文件:D:\Projects\scripts\Configs\HBOX。ini测试路径:无法将参数绑定到参数“Path”,因为它是空字符串。在D:\项目\自由职业者。co

  • 问题内容: 我需要更新我的时间。该值由正在执行的函数返回。 返回一个整数。 这将返回未防御状态。因此,我需要获取计数并将其传递给 问题答案: 如果您需要在每次调用之后更改重复间隔,则不能使用-使用恒定重复。您需要使用,因此您可以每次更改时间段:

  • 问题内容: 如何在不刷新页面的情况下将变量从jQuery传递到PHP?当我单击一个复选框时,我想将一个变量从jQuery传递到PHP。我也在使用formdialog。 我的PHP代码 我的JavaScript代码 问题答案: Ajax可以做到这一点。谷歌它,并检查api.jquery.com并查看ajax函数,.ajax(),.post(),.get(),.load()等。 关于您的特定问题,这是

  • 问题内容: 我有Google地图提供的JavaScript值,需要将其保存在MySQL数据库中。 其实我有变量 我需要将该变量传递给PHP变量lugar 问题答案: 如果要在页面转换时进行操作,则可以通过表单或在URL中传递它,然后仅使用或接收变量。 如果您需要无缝完成它,那么您可能需要考虑使用AJAX。