将范围变量传递给范围方法

时间:2016-10-18 23:09:51

标签: javascript angularjs

我大部分时间都看到了

观点:

real = a*cos(b)         # 0<a<0.5  0<b<45
imaginary = a*sin(b)    # 0<a<0.5  0<b<30

控制器:

<input ng-model="vm.model">
<button ng-click="vm.method(vm.model)"></button>

但这也有效:

function Controller() {
    var vm = this;
    this.method = function(parameter) {
       // do things with the model passed as parameter.
       // although it could get accessed directly by vm.model
}
}

对于控制器中的方法来说,直接访问同一范围内的变量而不将它们作为参数传递是不是一种不好的做法?

3 个答案:

答案 0 :(得分:1)

直接从没有参数的方法访问范围变量是不错的做法。

如果方法本身是通用的并且由多个按钮使用,则可以将它们作为参数传递。

一个典型的例子是当你有源和目标列表框的多个组合时,使用与源和目标参数相同的方法来移动项目。

答案 1 :(得分:0)

这实际上取决于您的设计。如果您想创建一个可重用的方法,那么最好传递一个参数而不是直接访问范围变量。

如果您在控制器中处理多个视图,这将非常有用。

让我们说你ModelController正在执行所有CRUD操作。您有创建视图,编辑视图和列表视图。

创建视图:

<input ng-model="vm.model">
<button ng-click="sharedMethod(vm.model)"></button>

修改视图:

<input ng-model="vm.model">
<button ng-click="sharedMethod(vm.model)"></button>

列表视图:

<div ng-repeat="vm in vmList">
    <input ng-model="vm.model">
    <button ng-click="sharedMethod(vm.model)"></button>
<div>

答案 2 :(得分:-1)

遵循这个原则,你应该总是用模板中的参数调用函数表达式。

让我们举一个小例子。

var vm = this;
this.method = function(parameter) {
  //It's clearer that the function expects parameter.
  if (parameter) { //do something } 
}

使用参数的好处:

  1. 它是可测试的。从长远来看,可测试的代码几乎总是更具可读性和可维护性。
  2. 当涉及到来电者时,它是不可知的。此函数可以由任意数量的不同控制器/服务/等重用,因为它不依赖于作用域的存在或该作用域的结构。
  3. ng-modelng-click的执行顺序不明确。相反,您应该在$ scope上使用ng-change$watch来确保获得模型变量的正确值。