ui-codemirror doesn't update the model
Per the instructions, I got the ui-codemirrror directive up and working. I used the ng-model directive to bind it to a property on the scope. This works great.
However, the ui-codemirror directive does not appear to be modifying the model when the user interacts with the editor. For example, I can set the scope property (e.g. $scope.demoString) to be "Hello World" when the controller initializes, and when I load the page the editor widget shows me the text. Then I change the text to add punctuation, so it reads "Hello, World!!!".
The model, $scope.demoString , does not change to reflect these new changes.
In my view, either the directive needs to be fixed so that it updates the model when the document is changed; or the documentation needs to be updated to clarify the section re: "play nice with ng-model"; explaining to the user how to get the data out of the document.
Same here. Didn't understand what "play nice with ng-model" really means.
Same here. change textarea to div. it seams only solution now
I use as this:
<ui-codemirror ui-codemirror-opts="editorOptions" ng-model="xml" ui-refresh="changed()"></ui-codemirror>
when I modify on codemirror board, the changed method in controller is triggered, and $scop.xml is also changed.
+1. It doesnt update model value when used with textarea. Div works fine though.
I have found it does work if the value isn't just a property on the scope. For example:
This does not work for me:
$scope.value = "// some javascript";
This does:
$scope.model = {
value : "// some javascript"
};
Using the second code sample above, and the following HTML, the model is updated as expected:
<ui-codemirror ng-model="model.value"></ui-codemirror>
@Rohland I just realized about this. https://github.com/angular/angular.js/wiki/Understanding-Scopes ng-model requires variable.field in order to achieve dual data binding due JS restrictions.
thanks @Rohland your solution works perfectly.