AngularJS 1.0.3中的内联编辑

17 浏览
0 Comments

AngularJS 1.0.3中的内联编辑

我找到了一个很棒的示例展示了AngularJS 0.10中的内联编辑指令。不幸的是，这段代码在1.0之后的版本中无法工作。有没有人有类似功能的最新Angular版本的示例呢？\n我通过将model: \'accessor\'改为model: \'&\'取得了一些进展，但是当我按下回车键时，文本值没有改变。关于指令定义对象的scope参数，AngularJS文档对我来说完全无法理解。

0

2 答案

0 Comments

在AngularJS 1.0.3中，出现了一个问题，即在内联编辑时无法正确绑定数据。该问题的原因是使用了错误的绑定方式。解决方法是使用双向绑定（'='）并直接绑定到作用域的'model'属性。

下面是一个修正后的示例代码，可以在http://plnkr.co/edit/tjTsNiQ7t0xMWkCEAzwo?p=preview查看。





$scope.model = '初始值';

0
0 Comments

AngularJS inline edit in 1.0.3的问题出现的原因是使用了错误的指令绑定方式model: '&'，导致双向绑定无法正常工作。解决方法是将指令中的model: '&'改为model: '='。

具体代码如下：

指令：

app.directive('inlineEdit', function() {
    return {
        restrict: 'E',           
        templateUrl: 'componentTpl.html',
        scope: {
            model: '=' 
        }
    };
});

模板：

jsFiddler示例链接：http://jsfiddle.net/XuhzP/147/

感谢作者的提示，我之前也试过=这种方式，非常感谢！

0