{"id":47840297,"url":"https://github.com/rbw/ui-codemirror-merge","last_synced_at":"2026-04-03T20:37:55.675Z","repository":{"id":72518906,"uuid":"41904728","full_name":"rbw/ui-codemirror-merge","owner":"rbw","description":"Angular UI Codemirror Merge directive","archived":false,"fork":false,"pushed_at":"2015-09-04T15:28:43.000Z","size":860,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-10-29T06:36:07.232Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rbw.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-09-04T08:10:40.000Z","updated_at":"2015-09-04T08:12:24.000Z","dependencies_parsed_at":"2023-02-28T04:31:43.343Z","dependency_job_id":null,"html_url":"https://github.com/rbw/ui-codemirror-merge","commit_stats":null,"previous_names":[],"tags_count":33,"template":false,"template_full_name":null,"purl":"pkg:github/rbw/ui-codemirror-merge","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rbw%2Fui-codemirror-merge","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rbw%2Fui-codemirror-merge/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rbw%2Fui-codemirror-merge/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rbw%2Fui-codemirror-merge/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rbw","download_url":"https://codeload.github.com/rbw/ui-codemirror-merge/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rbw%2Fui-codemirror-merge/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31375772,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-03T17:53:18.093Z","status":"ssl_error","status_checked_at":"2026-04-03T17:53:17.617Z","response_time":107,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2026-04-03T20:37:52.604Z","updated_at":"2026-04-03T20:37:55.615Z","avatar_url":"https://github.com/rbw.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# UI.Codemirror directive [![Build Status][travis-image]][travis-url] [![Code Climate][codeclimate-image]][codeclimate-url]\n\nThis directive allows you to add [CodeMirror](http://codemirror.net/) to your textarea elements.\n\n## Requirements\n\n- AngularJS 1.3.x\n- [CodeMirror 4.8.x](https://github.com/marijnh/CodeMirror)\n\n\n## Usage\n\nYou can get it from [Bower](http://bower.io/)\n\n```sh\nbower install angular-ui-codemirror\n```\n\nThis will copy the UI.Codemirror files into a `bower_components` folder, along with its dependencies. Load the script files in your application:\n\n```html\n\u003clink rel=\"stylesheet\" type=\"text/css\" href=\"bower_components/codemirror/lib/codemirror.css\"\u003e\n\u003cscript type=\"text/javascript\" src=\"bower_components/codemirror/lib/codemirror.js\"\u003e\u003c/script\u003e\n\u003cscript type=\"text/javascript\" src=\"bower_components/angular/angular.js\"\u003e\u003c/script\u003e\n\u003cscript type=\"text/javascript\" src=\"bower_components/angular-ui-codemirror/ui-codemirror.js\"\u003e\u003c/script\u003e\n```\n\nAdd the UI.Codemirror module as a dependency to your application module:\n\n```javascript\nvar myAppModule = angular.module('MyApp', ['ui.codemirror']);\n```\n\nFinally, add the directive to your html,\nas attribute :\n\n```html\n// Not well supported yet but still... We need feedbacks to improve it...\n\u003ctextarea ui-codemirror\u003e\u003c/textarea\u003e\n\n\u003cdiv ui-codemirror\u003e\u003c/div\u003e\n```\n\nas element :\n```xml\n\u003cui-codemirror\u003e\u003c/ui-codemirror\u003e\n```\n\n\n## Options\n\nAll the [Codemirror configuration options](http://codemirror.net/doc/manual.html#config) can be passed through the directive.\n\n```javascript\nmyAppModule.controller('MyController', [ '$scope', function($scope) {\n\t$scope.editorOptions = {\n\t\tlineWrapping : true,\n\t\tlineNumbers: true,\n\t\treadOnly: 'nocursor',\n\t\tmode: 'xml',\n\t};\n}]);\n```\n\nIf you update this variable with the new values, they will be merged and the ui will be updated.\n\n```xml\n\u003cui-codemirror ui-codemirror-opts=\"editorOptions\"\u003e\u003c/ui-codemirror\u003e\n```\n\n### Working with ng-model\n\nThe ui-codemirror directive plays nicely with ng-model.\n\nThe ng-model will be watched for to set the CodeMirror document value (by [setValue](http://codemirror.net/doc/manual.html#setValue)).\n\n_The ui-codemirror directive stores and expects the model value to be a standard javascript String._\n\n### ui-refresh directive\n\nIf you apply the refresh directive to element then any change to do this scope value will result to a [refresh of the CodeMirror instance](http://codemirror.net/doc/manual.html#refresh).\n\n_The ui-refresh directive expects a scope variable that can be any thing...._\n\n```html\n\u003cdiv ui-codemirror ng-model=\"x\" ui-refresh='isSomething'\u003e\u003c/div\u003e\n```\n\nNow you can set the _isSomething_ in the controller scope.\n\n```javascript\n$scope.isSomething = true;\n```\n\nNote: the comparison operator between the old and the new value is \"!==\"\n\n\n### CodeMirror instance direct access\n\nFor more interaction with the CodeMirror instance in the directive, we provide a direct access to it.\nUsing\n\n```html\n\u003cdiv ui-codemirror=\"{ onLoad : codemirrorLoaded }\" \u003e\u003c/div\u003e\n```\n\nthe `$scope.codemirrorLoaded` function will be called with the [CodeMirror editor instance](http://codemirror.net/doc/manual.html#CodeMirror) as first argument\n\n```javascript\nmyAppModule.controller('MyController', [ '$scope', function($scope) {\n\n  $scope.codemirrorLoaded = function(_editor){\n    // Editor part\n    var _doc = _editor.getDoc();\n    _editor.focus();\n\n    // Options\n    _editor.setOption('firstLineNumber', 10);\n    _doc.markClean()\n\n    // Events\n    _editor.on(\"beforeChange\", function(){ ... });\n    _editor.on(\"change\", function(){ ... });\n  };\n\n}]);\n```\n\n## Testing\n\nWe use Karma and jshint to ensure the quality of the code.  The easiest way to run these checks is to use grunt:\n\n```sh\nnpm install -g grunt-cli\nnpm install \u0026\u0026 bower install\ngrunt\n```\n\nThe karma task will try to open Firefox and Chrome as browser in which to run the tests.  Make sure this is available or change the configuration in `test\\karma.conf.js`\n\n\n### Grunt Serve\n\nWe have one task to serve them all !\n\n```sh\ngrunt serve\n```\n\nIt's equal to run separately:\n\n* `grunt connect:server` : giving you a development server at [http://localhost:8000/](http://localhost:8000/).\n\n* `grunt karma:server` : giving you a Karma server to run tests (at [http://localhost:9876/](http://localhost:9876/) by default). You can force a test on this server with `grunt karma:unit:run`.\n\n* `grunt watch` : will automatically test your code and build your demo.  You can demo generation with `grunt build:gh-pages`.\n\n\n### Dist\n\nThis repo is using the [angular-ui/angular-ui-publisher](https://github.com/angular-ui/angular-ui-publisher).\nNew tags will automatically trigger a new publication.\nTo test is locally you can trigger a :\n\n```sh\ngrunt dist build:bower\n```\n\nit will put the final files in the _'dist'_ folder and a sample of the bower tag output in the _'out/built/bower'_ folder.\n\n[travis-url]: https://travis-ci.org/angular-ui/ui-codemirror\n[travis-image]: https://travis-ci.org/angular-ui/ui-codemirror.svg?branch=master\n[codeclimate-url]: https://codeclimate.com/github/angular-ui/ui-codemirror\n[codeclimate-image]: https://codeclimate.com/github/angular-ui/ui-codemirror/badges/gpa.svg\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frbw%2Fui-codemirror-merge","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frbw%2Fui-codemirror-merge","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frbw%2Fui-codemirror-merge/lists"}