将嵌入的对象与模型绑定

通过使用此设计方法,可以将图形元素作为 JavaScript 对象嵌入到 Web 页面中,然后将这些对象与 IBM® Rational® Rhapsody® 模型的实时值绑定。 通过绑定嵌入的图形并将它们映射到启用了 Web 的元素的值,可以创建一个页面,以便在一个进程停止时在 Web 界面中显示一幅图像(例如停止符号),并显示另一图像以指示进程正在运行(例如绿色灯)。

过程

生成这类页面的一种方法是,设计一个包含所有静态元素的页面,然后向 HTML 添加脚本:

  1. 编辑 HTML 文件,在 HTML 文件头中的 </head> 标记之前,使用 script 标记包括 manage.inc 文件:
       <head>
          <title>Your Title Here</title>
          <script src='manage.inc'></script>
       </head>

    manage.inc 文件包含一组 JavaScript 文件,这些文件控制 Rational Rhapsody Web 界面的客户端行为。

  2. 要在页面中嵌入模型元素,请创建 WebObject 类型的 JavaScript 对象,并使用 bind 函数将每个对象与您通过因特网管理和控制的设备的元素绑定。

结果

以下样本代码在布尔元素的值为 true 时显示黄色灯,并在该值为 false 时显示红色灯:

   <html><head><title>Page Title</title>
   <script src='manage.inc'></script>
   <script>
   function updateMyLamp(val)
   {
      if (val == 'On') 
      {
         document.getElementById(‘myImage').src = 'redLamp.gif';
      }
      else    
         {
         document.getElementById(‘myImage').src = 'yellowLamp.gif';
      }
   }
   </script>
   </head>
   <body>
   <script>
   var lamp = new WebObject;
   bind(window.lamp,
       'ProcessController[0]::OMBoolean_attribute');
   lamp.update = updateMyLamp;
   </script>
   <img id=myImage border=0>
   <hr noshade>
   <i>Rotate the bool values here<i> 
   <script>show('ProcessController[0]::rotate');</script>
   </body>
   </html>

对象声明和绑定在文档头部的第二对 script 标记之间发生。

bind 函数用作模型中的元素值与 Web 界面之间的桥梁。此函数接收两个自变量,JavaScript 对象的变量名(示例中的 lamp)和 Rational Rhapsody 中的模型元素名称(示例中的 ProcessController[0]::rotate)。

在此示例中,下面这一行用于在 Web GUI 中刷新已更新的模型值:

   lamp.update = updateMyLamp;

此更新函数接受一个自变量,即元素的新值。

如果页面中的 GUI 控件需要向设备传递信息,请调用相应对象的 set 方法。set 方法接受一个自变量,即新设置的值。


反馈