Browse Source

demo for reacting on content changes via binding

Rodja Trappe 2 years ago
parent
commit
414d792129
1 changed files with 21 additions and 0 deletions
  1. 21 0
      website/more_documentation/label_documentation.py

+ 21 - 0
website/more_documentation/label_documentation.py

@@ -1,5 +1,26 @@
 from nicegui import ui
 
+from ..documentation_tools import text_demo
+
 
 def main_demo() -> None:
     ui.label('some label')
+
+
+def more() -> None:
+    @text_demo('Change Appearance Depending on the Content', '''
+        You can overwrite the `on_text_change` method to update other attributes of a label depending on its content. 
+        This technique also works for bindings as shown in the example below.
+    ''')
+    def status():
+        class status_label(ui.label):
+            def on_text_change(self, text: str) -> None:
+                super().on_text_change(text)
+                if text == 'ok':
+                    self.classes(replace='text-positive')
+                else:
+                    self.classes(replace='text-negative')
+
+        model = {'status': 'error'}
+        status_label().bind_text_from(model, 'status')
+        ui.switch(on_change=lambda e: model.update(status='ok' if e.value else 'error'))