javascript - Angular 函数通过引用传递作用域变量

标签 javascript angularjs

问题

是否可以将范围变量(特别是数组)通过引用传递给使用 ng-click 调用的函数,并操纵所述变量的值?

更新: 更明确地说,我的目标是避免在 $scope.app.onItemClick 中访问 $scope。

例子

Javascript:

(function() {
    angular.module('test', [])
    
    angular.module('test').controller('test',['$scope', function ($scope) {
      $scope.app = {};
      
      $scope.app.primarySet = [
        'test1',
        'test2',
        'test3'
      ]
      
      $scope.app.workingSet = [
        'test4',
        'test5',
        'test6'
      ]
      
      /*
       * Attempts to assign $scope.app.primarySet to $scope.app.workingSet using references to those two values.
       */
      $scope.app.onItemClick = function (primarySet, workingSet) {
        primarySet = workingSet
      }
    }])
  })()

相关的 HTML:

<button type="button" ng-click="app.onItemClick(app.primarySet, app.workingSet)">Update Primary Set</button>

请参阅 this Plunker在更多上下文中查看此代码。

我对这段代码的期望是,按下按钮时 $scope.app.primarySet 将设置为 $scope.app.workingSet。不幸的是,这种情况并非如此。调试时,在函数作用域内,primarySet被赋值给workingSet。但是 $scope.app.primarySet 不是。

动机

我这样做的动机源于 this SO reply .我也相信,如果我不直接引用它,那么测试操纵作用域的方法会更容易。我还发现这比让函数直接操作范围更直接。

前期研究

我遇到的与此相关的唯一资源是 this SO question .虽然这个问题很接近,但它的不同之处在于所讨论的参数是一个字符串,如果我理解正确的话,它不能被修改因为可以预期引用

最佳答案

如果通过 onItemClick 传递 $scope.app,则可以更改 $scope 中的 primarySet,如下所示:

  (function() {
    angular.module('test', [])

    angular.module('test').controller('test',['$scope', function ($scope) {
      $scope.app = {};

      $scope.app.primarySet = [
        'test1',
        'test2',
        'test3'
      ]

      $scope.app.workingSet = [
        'test4',
        'test5',
        'test6'
      ]

      /*
       * Attempts to assign $scope.app.primarySet to $scope.app.workingSet using references to those two values.
       */
      $scope.app.onItemClick = function (app, workingSet) {
        app.primarySet = workingSet;
      }
    }])
  })()

<button type="button" ng-click="app.onItemClick(app, app.workingSet)">Update Primary Set</button>

原因是当你传递数组时,只有值传递给了函数。

关于javascript - Angular 函数通过引用传递作用域变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34907066/

相关文章:

angularjs - 具有隔离和非隔离范围的指令内部内容

javascript - 禁止使用 AngularJS ng-click 分享到 Tumblr

javascript - AngularJS 分配不同的参数和函数

JavaScript 代码仅适用于 IE

javascript - 警告 : React. createElement : type should not be null, 未定义、 bool 值或数字

javascript - 如何将 Ruby 编译为 Javascript?

javascript - 将事件对象从指令传递到回调

javascript - 将敏感数据存储在 Local Stoarge 或 session 存储中是否安全? Localstorage 允许对敏感数据进行任何攻击

angularjs - 父子 Controller 数据设计

javascript - Angularjs - ng grid 所选行的组名是什么