AngularJS - ngModel无法赋值给函数

5
我的问题非常普遍。我看到很多人有类似的问题,但我仍然没有得到我的答案。
我的目标是实现一个独立的指令来封装由标签(span)和值(input)组成的div。这里有一些值得注意的具体内容:
1. 我的指令旨在将“input”的值保留到我的页面控制器分数中,该控制器是我指令所使用的作用域的祖先。因此,通过适当数量的".$parent",我可以访问我想要的作用域以进行ngModel分配。 2. 我的指令不知道它应该使用哪个占位符来保存用户输入。这个占位符作为HTML属性传递给我的指令。
我正在使用指令编译阶段来操作指令的HTML(主要是向指令的模板HTML添加属性)。在预链接阶段,我希望操作指令正在使用的作用域,以便将指令的占位符添加到我想要的作用域,并在需要时分配一些默认值。(我想我可以用ng-init来实现这个目标,而不是搞乱作用域,但我认为这与我的问题无关)。
正如我上面所解释的,我有一个函数(determinePlaceholderName()),它返回一个字符串,这个字符串是我想要分配给ngModel的确切值。例如:
$parent.$parent.$parent.placeHolderName

我希望将该函数分配给输入的ng-model属性,假设Angular将其视为表达式,评估它并生成我期望的结果。以下是我如何分配ng-model属性:

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;
}

[我的问题]
我的问题是什么呢?Angular 给我返回了一个错误提示:

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

文档中指出,非可分配表达式。

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

感谢您的时间!


很高兴看到一个问题,其中OP花时间解释了他的问题。干得好,伙计!+1 - Undefined
嗨,Milen, 我认为你应该更深入地了解作用域和继承。虽然我可以看到你试图使用jQuery,但'$parent.$parent.$parent'应该很难被接受。在我看来,如果你想使用jQuery,就只使用jQuery;如果你想使用Angular,就按照Angular的方式去做。我很乐意帮助/为你提供解决问题的工作示例。 - maurycy
1个回答

2
我希望这就是你要找的内容:

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

使用隔离作用域,您可以传递模型的名称,指令本身不知道该模型实际所在的作用域或其名称,但能够直接使用它并将其提供给ngModel。
此外,如果您不想使用隔离作用域或者想要使用函数,该plunker还提供了其他选择。

嗨,伙计,感谢你的回答,对我迟迟未能回复表示抱歉。实际上,我的问题与你提出的方案有些不同。但是你的想法很好,可以解决我的问题。不必调用函数来绑定ngModel,可以像你那样进行管理。由于我没有找到更好的解决方案,我将接受你的答案。然而,它的缺点是需要你的指令创建一个作用域(隔离作用域仍然是作用域),这有点限制性。 - Milen Igrachev
你不必使用隔离作用域或任何作用域,我已经在 Plunker 上更新了更多示例。 - haimlit

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接