随笔- 313  评论- 12176  文章- 1 

在ASP.NET Atlas中创建自定义的Transformer

English Version: http://dflying.dflying.net/1/archive/110_build_your_own_transformers_in_aspnet_atlas.html

ASP.NET Atlas中的绑定(binding)是一种将两个对象连接起来的强大方法。(您可以参考http://dflying.cnblogs.com/archive/2006/04/04/366900.html得到更多关于绑定的信息。)Atlas绑定会自动将源对象上变化了的属性应用到目标对象的指定属性上。但有时候您会希望在应用到目标对象之前对这个属性进行一些修改。比如,当显示一个有索引的列表时,您可能希望这个索引从1开始递增,而不是JavaScript中默认的从0开始。这时候您就需要使用Atlas Transformer了。Atlas中的Transformer是一种类似管道的东西,它将插入到由源对象的属性向目标对象的属性赋值的过程中,以期对将要赋值的属性进行必要的过滤/装饰/转换(在这里是将源属性加1),然后再赋值给目标属性。

Atlas提供一些内建的transformer,例如AddMultiplyCompare等。然而在实际开发中,大多数情况下我们都需要定义自己的transformer。让我们通过开发一个CustomBooleanTransformer的例子来熟悉如何书写自定义的transformer

CustomBooleanTransformer用来将布尔值转换为我们自定义的格式,例如Yes/No或者Completed/InProgress。如果我们选择使用绑定来将一个布尔值显示给用户,那么这个transformer将会是十分有用的,它带给用户更加友好的用户体验。

大体上,创建一个transformer将有如下四个步骤:

  1. 取得从源绑定对象中传入的将被转换的值。这里我们首先调用get_value()取得传入的值,并将其转换为布尔型。
  2. 取得transformer的参数。这里的参数是一个可以被逗号(,)分成两部分的字符串。布尔值true将被转换为第一部分,false将被转换为第二部分。如果传入的参数为空,则用默认的字符串true/false代替。
  3. 进行转换。在这个步骤应当通过您自己的逻辑把传入的值转换成将要传出的值(一般会用到上一步骤中取得的transformer的参数)。这里我们首先用逗号(,)将参数分成两个部分,然后用第一部分代替true,用第二部分代替false。如果参数不能被分成两个部分,那么使用true/false代替。
  4. 将转换后的值输出,调用方法set_value()来实现。

下面是CustomBooleanTransformerJavaScript代码,将其保存为CustomBooleanTransformer.js

Sys.BindingBase.Transformers.CustomBoolean = function(sender, eventArgs) {
    
// step 1, get input value.
    var value = eventArgs.get_value();
    
if (typeof(value) != 'boolean') {
        value 
= Boolean.parse(value);
    }

    
    
// step 2, get arguments will be used in trasforming.
    var customString = eventArgs.get_transformerArgument();
    
if (customString == null || customString == '') {
        customString 
= 'true,false';
    }

    
    
// step 3, do the transformation.
    var customValues = customString.split(',');
    
if (customValues.length != 2)
    
{
        customValues[
0= 'true';
        customValues[
1= 'false';
    }

    
var newValue = value ? customValues[0] : customValues[1];
    
    
// step 4, set the transformed value as output.
    eventArgs.set_value(newValue);
}

 

OK,现在让我们测试一下这个CustomBooleanTransformer。在页面上添加一个checkbox和一个textbox并将他们绑定起来。当checkbox被选中/取消选中时,textbox中会显示相应的被转换后的布尔值。

下面是ASPX文件中的HTML定义。不要忘记在ScriptManager中添加对CustomBooleanTransformer.js文件的引用。

<atlas:ScriptManager ID="sm1" runat="server">
    
<Scripts>
        
<atlas:ScriptReference Path="CustomBooleanTransformer.js" />
    
</Scripts>
</atlas:ScriptManager>
<input id="myCheckbox" type="checkbox" />
<input id="myTextbox" type="text" />

 

下面是Atlas脚本定义。这里指定tranformerArgument‘Yes,No’,以期让布尔值true转化为Yesfalse转化为No
<page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
    
<references>
    
</references>
    
<components>
        
<checkBox id="myCheckbox" />
        
<textBox id="myTextBox">
            
<bindings>
                
<binding dataContext="myCheckbox" dataPath="checked"  
                property
="text" transform="CustomBoolean" transformerArgument="Yes,No" />
            
</bindings>
        
</textBox>
    
</components>
</page>

浏览器中的实际结果:


posted on 2006-04-05 23:58 Dflying Chen 阅读(...) 评论(...) 编辑 收藏