将ngModel提供给自定义指令

时间:2014-08-23 18:37:26

标签: javascript html angularjs angularjs-directive

我正在创建一个自定义AngularJS指令,该指令使用带有更多功能的输入标记。

的index.html

sabel-input-directive ng-model="number" label="number" type='number' min="3" max="10" required="false" sabel-input-directive

我想提供ng-model属性,我可以将其作为常规属性使用。

此自定义标记仅包含一个输入标记 <input name='myInput'>

我尝试在指令属性中传入一个字符串,并在内部标记中提供它,如下所示:

input name='myInput' ng-model='{{theModel}}'但它没有用。

我知道我必须"require: ngModel"

但我不知道如何做到这一点:(而且我想要从自定义指令的属性中指定模型名称这一点很重要:)

所以请帮忙,因为这个标签对我来说会有很多帮助! 并谢谢:)

2 个答案:

答案 0 :(得分:0)

你不要将themodel包裹在ng-model属性

中的胡须中

答案 1 :(得分:0)

我认为你错过了有关指令范围的好文章。 Link to article.

Angular controller我们将获取具有自己范围的ng-model和指令

angular.controller("ctr", function($scope){
  $scope.model = {
    name: "Hi"
  };
});

angular.directive("example", function(){
  return {
    restrict: "E",
    template: "<input type='text' ng-model='model'>",
    scope: {
      model: "="
    },
});

现在是html代码

<div ng-controller="ctr">
  <example data-model="model"></example>
</div>