AngularJS 1.0.3內聯編輯

我發現一個excellent fiddle顯示了AngularJS 0.10中的內聯編輯指令。不幸的是，這些代碼在1.0之後的版本中不起作用。有沒有人在最近的Angular版本中有類似功能的例子？AngularJS 1.0.3內聯編輯

我設法通過將model: 'accessor'更改爲model: '&'取得了一些進展，但是當我按Enter時，文本值不變。關於指令定義對象的scope參數的AngularJS documentation對我來說是完全不可能的。

來源

2013-01-14 Daniel Buckmaster

當然，只要我這後我找到[解決方案]（http://jsfiddle.net/C5e4j /）。 –

這裏是一個很好的答案關於不同的方式綁定到隔離範圍內的數據http://stackoverflow.com/a/13033249/527968 –

如果你想要一個簡單的雙向結合使用model: '='代替model: '&'

指令：

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

模板：

<script type="text/ng-template" id="componentTpl.html"> 
    <span ng-hide="editMode" ng-click="editMode=true;value=model">{{model}}</span> 
    <input type="text" ng-model="value" ng-show="editMode" ng-model-instant ng-enter="editMode=false" ng-change="model=value"/> 
</script>

jsFiddler：http://jsfiddle.net/XuhzP/147/

來源

2013-01-14 17:04:29 bmleite

可能已經發誓我也嘗試過'='在一點。感謝堆！ –

您應該使用'='綁定（雙向），然後直接綁定到範圍的'model'屬性。

這裏被修正的樣本：http://plnkr.co/edit/tjTsNiQ7t0xMWkCEAzwo?p=preview

（它的一個相同的溶液@bmleite了）

來源

2013-01-14 17:09:44

AngularJS 1.0.3內聯編輯

回答

相關問題