AngularJS - 是否可以在链接或编译中更改指令上的ngModel属性的值？

Question

我正在尝试创建一个指令，该指令将基于属性值将ngModel属性添加到标记。 例如：

angular.module('myModule').
  directive('myDirective', function() {
    return {
      link: function(scope, elem, attrs) {
        var modelName = 'myPrefix.' + attrs.name;
        attrs.$set('ngModel', modelName);
      }
    };
  });

这个html：

<input name="foo" my-directive></input>

编译成

<input name="foo" ng-model="myPrefix.foo" my-directive></input>

它接受输入的名称，附加前缀，并将ngModel属性设置为该值。

当我尝试在链接函数中执行此操作时，似乎input未使用formController注册，因此form.foo返回undefined。

是否有可能完成我想要做的事情？

编辑：

似乎在HTML上设置了ngModel属性，但它没有在表单中注册，或者没有实例化ngModelController。 如果我查看范围中ngModel的值， ngModel在修改输入时它不会更改。

Answer 1

您应该查看NgModelController的文档。 它会回答你的问题。 有关进一步说明，请参阅以下内容：

您可以捕获link:的第四个参数link: function，这是您的ng-model值。 您可以使用该对象来读取和设置模型。

link: function(scope, element, attrs, ngModel) {
    if(!ngModel) return; // do nothing if no ng-model

    // Specify how UI should be updated
    ngModel.$render = function() {
      element.html(ngModel.$viewValue || '');
    };

    // Listen for change events to enable binding
    element.on('blur keyup change', function() {
      scope.$apply(read);
    });
    read(); // initialize

    // Write data to the model
    function read() {
      var html = element.html();
      // When we clear the content editable the browser leaves a <br> behind
      // If strip-br attribute is provided then we strip this out
      if( attrs.stripBr && html == '<br>' ) {
        html = '';
      }
      ngModel.$setViewValue(html);
    }
}

希望有所帮助。

Answer 2

我能够通过使用模板功能来完成目标。 我认为它在链接函数中不起作用，因为它发生在收集了所有指令之后，因此编译器无法识别添加了ngModel指令。 我不确定为什么它在编译函数中不起作用（即使我将优先级设置为100）。

这是该指令的工作版本：

angular.module('myModule').
  directive('myDirective', function() {
    return {
      replace: true,
      template: function(elem, attr) {
        var newElem = '<input ng-model="model.' + attr.name + '">';
        return newElem;
      }
    };
  });