AngularJS-ngModel不能分配给函数




我的问题很常见。我看到许多不同的案例中有人和我有类似的问题,但我仍然没有答案。

[我的目标]
我想实现一个独立的指令来封装由标签(span(和值(input(组成的div。这里有一些细节值得一提:

  1. 我的指令旨在将"input"的值保留到我的页面控制器分数中,这是我的指令所使用的范围的祖先。因此,只要有适当数量的".$parent",我就可以访问ngModel分配所需的范围
  2. 我的指令不知道用于将用户输入保留为的占位符的名称。此占位符是我的指令的HTML属性

[我的方法]
我正在使用指令编译阶段来操作指令的HTML(主要是向指令的模板HTML添加属性(。在预链接阶段,我希望操作指令正在使用的作用域,以便将指令的占位符添加到我想要的作用域中,并在需要时为其分配一些默认值。(我想我可以用ng-init来实现这一点,而不是扰乱作用域,但我认为这与我的问题无关(。

[我做了什么]
正如我在上面解释的那样,我有一个函数(determinePlaceholderName(((,它返回一个字符串,这正是我想要分配给ngModel的值。例如:

$parent.$parent.$parent.placeHolderName

我想把这个函数分配给input的ng模型属性,假设Angular会把它当作一个表达式来处理,对它求值并产生我期望的结果。以下是我如何分配ng模型属性:

compile: function(cElem, cAttrs) {
    //Some non relevant code here ....
    $(cElem[0]).find("div input").attr("ng-model", "determinePlaceholderName()");
}

基本上,我所期望的是这样对待:

$(cElem[0]).find("div input").attr("ng-model", "$parent.$parent.$parent.placeHolderName");

[关于determinePlaceholderName((]
我在指令的链接函数中定义了这个函数:

link: function ($scope) {
        $scope.constructValuePlaceholderName = function() {
            //Some logic here.
            return result;
}

[我的问题]
最后我的问题是什么。角度导致错误,向我解释

<input ng-model="myFunc()">

是文档中不可赋值的表达式。

[我的问题]
如果Angular禁止函数赋值,我该如何常规设置ngModel??

感谢您抽出时间!

我希望这就是您想要的:

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

使用隔离作用域,您可以传递模型的名称,而指令本身并不知道模型实际所在的作用域或其名称,但可以按原样使用它并将其提供给ngModel。

plunker还提供了替代方案,以防您不想使用隔离作用域或想使用函数。

最新更新