在指令上设置多个模型？

我正在玩angularjs，想制作一个双列表框 - 左边的列表就是一切，右边的列表包含从一个列表到另一个列表中的项目“推送”。箭头来回推动物品。在指令上设置多个模型？

我可以在直接的HTML和使用angularjs做到这一点很容易，但我一直在寻找进入我怎么能使其可重复使用，这样的事情： <dual-list-box all-items='currentController.allItems' selected-items='currentController.selectedItems' />

我在哪里可以排序的传中，两个列表..所以不管控制器或列表名称，我可以使用我的双列表框控件。

这可能吗？怎么样？我在想这个指令可能会起作用，但我不知道该怎么做。

而且我不知道我在想这很正确的方式....

来源

2013-10-03 Nicros

指令当然应该在这里工作。例如：

module.directive('dualListBox', function() { 
    return { 
     restrict: 'E', 
     scope: { // set up isolated scope, bind to parent scope's properties (declared in view) 
      allItems: '=', 
      selectedItems: '=' 
     }, 
     template: 'HTML template, can bind to allItems and selectedItems in isolated scope', 
     link: (scope, elm, attr) { 
      // use to scope.allItems & scope.selectedItems here 
     } 
    } 
});

这就是主意。您可能想在实施过程中参考documentation for directive。

来源

2013-10-03 16:23:58

啊真棒！我认为我没有完全理解范围方面...... – Nicros

该语法创建了一个名为“隔离范围”的东西，它包含与视图中声明的父范围的属性绑定的属性，允许您将HTML完全声明为你在问题中提出要求。它的语法起初有点复杂（我知道那个等号），你应该读一下我发送的链接。 –

会不会，谢谢！ – Nicros

这里是一个工作示例，它保留了在指令范围内的两个移动方法。但是，不要使用箭头（不确定你的意思，即只移动底部元素，或每个箭头或什么），只需单击一个元素即可将其移过来。

myApp.directive('duallist', function() { 
return { 
    restrict: 'E', 
    replace: true, 
    scope: { 
     data1: '=', 
     data2: '='   
    }, 
    template: '<div><ul class="list"><li ng-repeat="datum in data1" ng-click="move(datum, data1)">{{datum}}</li></ul> <ul class="list"><li ng-repeat="datum in data2" ng-click="move(datum, data2)">{{datum}}</li></ul></div>', 
    link: function(scope, ele, attrs) { 
     scope.move = function(datum, dataset) { 
      if (dataset == scope.data1) { 
      scope.data2.push(datum); 
      dataset.splice(dataset.indexOf(datum), 1);     
      } 
      else{ 
      scope.data1.push(datum); 
      dataset.splice(dataset.indexOf(datum), 1);  
      }  
     } 
    } 
}

}）;

工作小提琴：http://jsfiddle.net/joshdmiller/HB7LU/

来源

2013-10-03 17:09:53

你的小提琴链接不工作:( – Nicros

臭虫，我忘了保存它！如果你还需要它，我会在一个小时内给你一个工作版本 –

http://jsfiddle.net/HB7LU/563/ 你走了！ –

在指令上设置多个模型？

回答

相关问题