fix(ngShow): Add/remove ng-hide class instead of ng-show class

Closes #521
dart-archive · Feb 11, 2014 · 0b88d2e · 0b88d2e
1 parent aabaa98
commit 0b88d2e
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 11 deletions.
diff --git a/lib/directive/ng_show_hide.dart b/lib/directive/ng_show_hide.dart
@@ -33,17 +33,15 @@ class NgHideDirective {
     selector: '[ng-show]',
     map: const {'ng-show': '=>show'})
 class NgShowDirective {
-  static String NG_SHOW_CLASS = 'ng-show';
-
   final dom.Element element;
 
   NgShowDirective(this.element);
 
   set show(value) {
     if (toBool(value)) {
-      element.classes.add(NG_SHOW_CLASS);
+      element.classes.remove(NgHideDirective.NG_HIDE_CLASS);
     } else {
-      element.classes.remove(NG_SHOW_CLASS);
+      element.classes.add(NgHideDirective.NG_HIDE_CLASS);
     }
   }
 }

diff --git a/test/core_dom/ng_mustache_spec.dart b/test/core_dom/ng_mustache_spec.dart
@@ -86,39 +86,39 @@ main() {
 
     beforeEach(inject((TestBed tb) => _ = tb));
 
-    it('should add/remove ng-show class', () {
+    it('should add/remove ng-hide class', () {
       var element = _.compile('<div ng-show="isVisible"></div>');
 
-      expect(element).not.toHaveClass('ng-show');
+      expect(element).not.toHaveClass('ng-hide');
 
       _.rootScope.$apply(() {
         _.rootScope['isVisible'] = true;
       });
-      expect(element).toHaveClass('ng-show');
+      expect(element).not.toHaveClass('ng-hide');
 
       _.rootScope.$apply(() {
         _.rootScope['isVisible'] = false;
       });
-      expect(element).not.toHaveClass('ng-show');
+      expect(element).toHaveClass('ng-hide');
     });
 
     it('should work together with ng-class', () {
       var element = _.compile('<div ng-class="currentCls" ng-show="isVisible"></div>');
 
       expect(element).not.toHaveClass('active');
-      expect(element).not.toHaveClass('ng-show');
+      expect(element).not.toHaveClass('ng-hide');
 
       _.rootScope.$apply(() {
         _.rootScope['currentCls'] = 'active';
       });
       expect(element).toHaveClass('active');
-      expect(element).not.toHaveClass('ng-show');
+      expect(element).toHaveClass('ng-hide');
 
       _.rootScope.$apply(() {
         _.rootScope['isVisible'] = true;
       });
       expect(element).toHaveClass('active');
-      expect(element).toHaveClass('ng-show');
+      expect(element).not.toHaveClass('ng-hide');
     });
   });
 

diff --git a/test/directive/ng_show_hide_spec.dart b/test/directive/ng_show_hide_spec.dart
@@ -24,4 +24,25 @@ main() {
       expect(_.rootElement).not.toHaveClass('ng-hide');
     });
   });
+
+  describe('NgShow', () {
+    TestBed _;
+    beforeEach(inject((TestBed tb) => _ = tb));
+
+    it('should add/remove ng-hide class', () {
+      _.compile('<div ng-show="isShown"></div>');
+
+      expect(_.rootElement).not.toHaveClass('ng-hide');
+
+      _.rootScope.$apply(() {
+        _.rootScope['isShown'] = true;
+      });
+      expect(_.rootElement).not.toHaveClass('ng-hide');
+
+      _.rootScope.$apply(() {
+        _.rootScope['isShown'] = false;
+      });
+      expect(_.rootElement).toHaveClass('ng-hide');
+    });
+  });
 }