@@ -138,7 +138,7 @@ The following example demonstrates:
138138 };
139139
140140 $scope.isSaveDisabled = function() {
141- return $scope.userForm.$ invalid || angular.equals($scope.master, $scope.form);
141+ return $scope.userForm.invalid || angular.equals($scope.master, $scope.form);
142142 };
143143
144144 $scope.cancel();
@@ -150,7 +150,7 @@ The following example demonstrates:
150150
151151 <label>Name:</label><br/>
152152 <input type="text" name="customer" ng:model="form.customer" required/>
153- <span class="error" ng:show="userForm.customer.$ error.REQUIRED">
153+ <span class="error" ng:show="userForm.customer.error.REQUIRED">
154154 Customer name is required!</span>
155155 <br/><br/>
156156
@@ -165,15 +165,15 @@ The following example demonstrates:
165165 <input type="text" name="zip" ng:pattern="zip" size="5" required
166166 ng:model="form.address.zip"/><br/><br/>
167167
168- <span class="error" ng:show="addressForm.$ invalid">
168+ <span class="error" ng:show="addressForm.invalid">
169169 Incomplete address:
170- <span class="error" ng:show="addressForm.state.$ error.REQUIRED">
170+ <span class="error" ng:show="addressForm.state.error.REQUIRED">
171171 Missing state!</span>
172- <span class="error" ng:show="addressForm.state.$ error.PATTERN">
172+ <span class="error" ng:show="addressForm.state.error.PATTERN">
173173 Invalid state!</span>
174- <span class="error" ng:show="addressForm.zip.$ error.REQUIRED">
174+ <span class="error" ng:show="addressForm.zip.error.REQUIRED">
175175 Missing zip!</span>
176- <span class="error" ng:show="addressForm.zip.$ error.PATTERN">
176+ <span class="error" ng:show="addressForm.zip.error.PATTERN">
177177 Invalid zip!</span>
178178 </span>
179179 </ng:form>
@@ -284,56 +284,38 @@ This example shows how to implement a custom HTML editor widget in Angular.
284284 $scope.htmlContent = '<b>Hello</b> <i>World</i>!';
285285 }
286286
287- HTMLEditorWidget.$inject = ['$scope', '$element', '$sanitize'];
288- function HTMLEditorWidget(scope, element, $sanitize) {
289- scope.$parseModel = function() {
290- // need to protect for script injection
291- try {
292- scope.$viewValue = $sanitize(
293- scope.$modelValue || '');
294- if (this.$error.HTML) {
295- // we were invalid, but now we are OK.
296- scope.$emit('$valid', 'HTML');
297- }
298- } catch (e) {
299- // if HTML not parsable invalidate form.
300- scope.$emit('$invalid', 'HTML');
301- }
302- }
287+ angular.module('formModule', []).directive('ngHtmlEditor', function ($sanitize) {
288+ return {
289+ require: 'ngModel',
290+ link: function(scope, elm, attr, ctrl) {
291+ attr.$set('contentEditable', true);
303292
304- scope .$render = function() {
305- element .html(this.$ viewValue);
306- }
293+ ctrl .$render = function() {
294+ elm .html(ctrl. viewValue);
295+ };
307296
308- element.bind('keyup', function() {
309- scope.$apply(function() {
310- scope.$emit('$viewChange', element.html());
311- });
312- });
313- }
297+ ctrl.formatters.push(function(value) {
298+ try {
299+ value = $sanitize(value || '');
300+ ctrl.emitValidity('HTML', true);
301+ } catch (e) {
302+ ctrl.emitValidity('HTML', false);
303+ }
304+
305+ });
314306
315- angular.module('formModule', [], function($compileProvider){
316- $compileProvider.directive('ngHtmlEditorModel', function ($formFactory) {
317- return function(scope, element, attr) {
318- var form = $formFactory.forElement(element),
319- widget;
320- element.attr('contentEditable', true);
321- widget = form.$createWidget({
322- scope: scope,
323- model: attr.ngHtmlEditorModel,
324- controller: HTMLEditorWidget,
325- controllerArgs: {$element: element}});
326- // if the element is destroyed, then we need to
327- // notify the form.
328- element.bind('$destroy', function() {
329- widget.$destroy();
307+ elm.bind('keyup', function() {
308+ scope.$apply(function() {
309+ ctrl.read(elm.html());
310+ });
330311 });
331- };
332- });
312+
313+ }
314+ };
333315 });
334316 </script>
335317 <form name='editorForm' ng:controller="EditorCntl">
336- <div ng:html-editor- model="htmlContent"></div>
318+ <div ng:html-editor ng: model="htmlContent"></div>
337319 <hr/>
338320 HTML: <br/>
339321 <textarea ng:model="htmlContent" cols="80"></textarea>
0 commit comments