Angularjs集成于ASP.NET MVC数据绑定重构

这几天,对程序重构,主要针对angularjs的绑定:

第一个例子:

下面是一段html程序:

Angularjs集成于ASP.NET MVC数据绑定重构_第1张图片

 

不管是name或者是ng-model的属性值,它都有一定规律"StartX"和"EndX"  后面的数字是连续的序号。

我们可以使用ASP.NET MVC的Razor的语法@for来简化它们:

Angularjs集成于ASP.NET MVC数据绑定重构_第2张图片

 @{
                for (var i = 1; i <= 13; i++)
                {
                    var nm_s = "Start" + i;
                    var nm_e = "End" + i;

                    
"text" name=@nm_s ng-model=@nm_s style="position:relative; left:35px;" validate-Date /> "text" name=@nm_e ng-model=@nm_e style="position:relative; left:102px;" validate-Date />
} }
Source Code

 

第2个例子:

Angularjs集成于ASP.NET MVC数据绑定重构_第3张图片

 

@{
                            for (var i = 1; i <= 5; i++)
                            {
                                Period @i Starting
                                Period @i Ending
                            }
                        }
Source Code

 

第3个例子:

Angularjs集成于ASP.NET MVC数据绑定重构_第4张图片

 

 

@{
                                for (var i = 1; i <= 5; i++)
                                {

                                    
                                        {{p['Start' + @i] | jsonDateFormat:'yyyy-MM-dd'}}
                                    
                                    
                                        {{p['End' + @i] | jsonDateFormat:'yyyy-MM-dd'}}
                                    
                                }
                            }
Source Code

 

你可能感兴趣的:(Angularjs集成于ASP.NET MVC数据绑定重构)