Question

我有一个条件，我在列表网格中有输入框，我有一个指令，现在我想将值发送到此指令，输入值是什么......到此为止它的工作正常，但是现在，当我尝试更改指令输入框中的值时，它不会更新列表网格输入框，其值为指令集。

这是一个有效的工作人员，让我知道我做错了什么。

http://plnkr.co/edit/DZdN4itTNccVsuBEJahr?p=preview

我的controller＆amp; directive代码就像 -

var myApp = angular.module('myApp', []);

myApp.controller('mainCtrl', function(){
  var vm = this;

  vm.fordirective = '';

  vm.list = [
    {id: "1", name: 'Test 1', age: 35},
    {id: "2", name: 'Test 2', age: 36},
    {id: "3", name: 'Test 3', age: 37},
    {id: "4", name: 'Test 4', age: 38},
  ];
})

myApp.directive('testdir', function(){
  return {
    restrict: 'EA',
    scope: {
      directivevalue: "="
    },
    templateUrl: 'dirtemplate.html',
    link: function(scope, elem, attrs) {

    }
  };
})

Answer 1

您可以将vm.fordirective设置为item的对象引用：

然后testdir需要知道来自item的哪个字段用作模型值。例如，让我们使用帮助器属性：

<testdir directivevalue="vm.fordirective" field="age">Loading..</testdir>

最后在指令模板中，您需要绑定到directivevalue[field]：

<input type="text" ng-model="directivevalue[field]" />

演示：http://plnkr.co/edit/jWKwDJvYOutcLihi7UyC?p=preview

Answer 2

检查此工作plnkr -

http://plnkr.co/edit/DZdN4itTNccVsuBEJahr?p=preview

指令代码 -

myApp.directive('testdir', function(){
  return {
    restrict: 'EA',
    scope: {
      directivevalue: "=",
      index: "="
    },
    templateUrl: 'dirtemplate.html',
    link: function(scope, elem, attrs) {

      scope.setParentValue = function(directivevalue){
        scope.$parent.vm.list[scope.index].age = directivevalue;
      };
    }
  };
})

并在网格列表输入中，添加ng-change以跟踪值更改为指令 -

<input ng-model="item.age" ng-click="vm.fordirective = item.age; vm.index = $index" ng-change="vm.fordirective = item.age; vm.index = $index" />

Answer 3

而不是使用$ parent（因为它不是一个好习惯），因为angular本身处理双向数据绑定非常顺利。

为此，您可以将完整项目与指令范围绑定。

检查work plunkr：

https://embed.plnkr.co/LyE0G0APhwC4nco1KvOw/

指令代码：

scope.setParentValue = function(directivevalue){ scope.directivevalue = directivevalue; };

从指令AngularJS更改控制器范围值

3 个答案: