Question

我有以下代码：

<input id="id">
<button data-action="bea" ng-click="Create($('#id1')[0].value);" class="btn">Insert ID</button>
<button data-action="bea" ng-click="Create($('#id2')[0].value);" class="btn">Insert ID</button>

在JS中我有：

$scope.Create = function (id){
        if (id === undefined) {
            $scope.data = "You must specify an id";
        } else {
                $scope.data = data;
                console.log(data);
            });
        }
    };

当调用进入Create函数时，id的值是未定义的。

如果我在创建功能的边缘添加以下行，一切正常：

id = $('#id')[0].value;

如果我发送一个恒定值，它可以工作：

<button data-action="bea" ng-click="Create('SomeID');" class="btn">Insert ID</button>

为什么会发生这种情况？如果不将价值线放入方法中，我怎么能这样做呢？

由于

Answer 1

这只是评论和其他答案的扩展，您可以使用角度在很多方面实现这一点，一个简单的例子可能是： -

  <!-- Add a controller -->
  <div ng-controller="MainCtrl"> 
     <!-- Give a model binding to your text input -->
     <input ng-model="userEntry" type="text"/> 
     <!-- ng-click pass which ever argument you need to pass, provided it is an expression that can be evaluated against the scope or any constants -->
     <button data-action="bea" ng-click="Create(userEntry);" class="btn">Insert ID</button>
    <!-- Some simple data binding using interpolation -->
    {{data}}
     <!-- Just for demo on repeater on a list of items on the scope -->
     <div ng-repeat="item in items track by $index">{{item}}</div>
  </div>

<强> Example Demo

我最初试图做的2美分： -

使用角度绑定而不是直接访问DOM来获取数据，它确实可以帮助您处理数据，而无需担心如何在DOM中访问或呈现它。如果您认为需要访问DOM以实现业务逻辑，请重新考虑设计，如果您确实需要这样做，请在指令中执行。 Angular对设计以及何时进行DOM访问非常重视。

Answer 2

我的猜测是$在评估ng-click值时没有绑定到jQuery函数，因为它没有在Angular范围中公开。

解决方案：

在某个地方公开jQuery函数，例如控制器中的$scope.$ = $;。
按照建议使Create函数无参数，开头为var id = $('#id')[0].value;
我的最爱：避免使用jQuery。如果你在#id元素中放入一些数据，那么检索它的方法可能比查询DOM更自然（AngularJS惯用）（例如Angular服务）。

特别是，如果您定位的元素是<input>元素，则使用ngModel指令将值链接到可在控制器中访问的$scope属性：

<input ng-model="inputData"/>

Answer 3

这不是你在AngularJS中应该做的。如果你想使用AngularJS，你应该在Angular中思考。请参阅此帖子（"Thinking in AngularJS" if I have a jQuery background?）

所有DOM操作都应该在Directive中完成。请参阅我发现非常清楚的页面。（http://ng-learn.org/2014/01/Dom-Manipulations/）

Answer 4

您尝试传递的JavaScript作为create函数的参数在Create函数的范围内不可用。

尝试以不同的方式定位元素。

这有帮助吗？

ng-click不从DOM中获取参数

4 个答案: