Question

我有一个带有表单的指令（这里的示例是一个简单的输入），我在同一页面中使用了几个（index.html）在这个指令之外我有一个按钮，当我点击它时，我想要获取所有指令中的数据＆＃39;输入。

起初我尝试使用此问题的解决方案How to call a method defined in an AngularJS directive? 但是我很难同时使用它和几个指令。我还尝试使用带有$$ childHead的子列表，但我从其他帖子中了解到这样做是不对的。无论如何，我不确定为什么，但最后一个解决方案停止工作（它不能再调用指令函数）。

这样做的最佳方法是什么？

这是我的简化代码：

的index.html：

    <div ng-repeat="item in data">
        <h1> {{item.name}} </h1>
        <my-dir info=item >/my-dir>
    </div>
    <input type="submit" value="Save" ng-click="save()" />

指令：

    app.directive('myDir', function() {
      return {
        restrict: 'E',
        scope: {
            info: '='
        },
        templateUrl: '<input type="text" ng-model="myfield" />',
        link: function(scope, element, attrs) {
                scope.getData = function(){
                    var field_data = scope.myfield;
                    return field_data // not sure if needed
                }
        }
      };
    });

控制器：

    $scope.save= function(){
        // Call the getData function of the directive or get 
        // the data needed somehow and do something with it
    }

Answer 1

实现相同结果的最佳方法是将数据作为双向绑定参数传递给指令，就像通常使用带有角度的标准指令的ng-model一样。

... 范围： { 信息：＆＃39; =＆＃39;，数据：＆＃39; =＆＃39; }， ...

然后

<my-dir info="item" data="data[0]" ></my-dir>
<my-dir info="item" data="data[1]" ></my-dir>

使用来自控制器的返回值调用指令函数

1 个答案: