AngularJS和ColdFusion CFC

发布时间：2020-12-17 06:52:32 所属栏目：安全来源：网络整理

导读：我正在尝试使用ColdFusion后端接收AngularJS,并遇到了一些障碍.我正在使用CF Art Gallery数据库修改他们的“To Do”应用程序 http://angularjs.org/.我正在尝试使用AJAX将ColdFusion CFC链接到Angular应用程序. 以下是我的artists.cfc： cfcomponentcffuncti

我正在尝试使用ColdFusion后端接收AngularJS,并遇到了一些障碍.我正在使用CF Art Gallery数据库修改他们的“To Do”应用程序 http://angularjs.org/.我正在尝试使用AJAX将ColdFusion CFC链接到Angular应用程序.

以下是我的artists.cfc：

<cfcomponent>

<cffunction name="getArtists" access="remote" >
    <cfargument name="firstName" default="">
    <cfargument name="lastName" default="">

    <cfquery name="getArtists_sql" datasource="cfartgallery">
        SELECT
            firstname as text,lastname as done 
        FROM artists
        WHERE 0=0
    <cfif firstName neq "">
        AND ucase(firstname) like ucase('%#FIRSTNAME#%')
    </cfif>
    <cfif lastName neq "">
        OR ucase(lastname) like ucase('%#LASTNAME#%')       
    </cfif>
    </cfquery>

    <cfreturn getArtists_sql>
</cffunction>

</cfcomponent>

我使用AngularJS使用以下代码调用CFC：

function TodoCtrl($scope,$http) {
    $http.get('cfc/artists.cfc?method=getArtists&returnformat=json').
        success(function (response) {
            $scope.todos = data.DATA;
    }).
        error(function (data) {
            $scope.todos = data;
        });
}

我知道我得到了回复.以下是Chrome的开发者工具为我返回的JSON字符串：

{
"COLUMNS":
    ["TEXT","DONE"],"DATA":[
    ["Aiden","Donolan"],["Austin","Weber"],["Elicia","Kim"],["Jeff","Baclawski"],["Lori","Johnson"],["Maxwell","Wilson"],["Paul","Trani"],["Raquel","Young"],["Viata","Trenton"],["Diane","Demo"],["Anthony","Kunovic"],["Ellery","Buntel"],["Emma",["Taylor Webb","Frazier"],["Mike","Nimer"]
]}

这看起来不像Angular在他们的演示中使用的符号：

[
{text:'learn angular',done:true},{text:'build an angular app',done:false}
]

有人能指出我正确的方向,我怎么能让这个正常工作？理想情况下,我希望保持CFC完好无损,以便可以在不同的应用程序中重用,因此JSON操作必须在Javascript端完成.

解决方法

默认情况下,Coldfusion使用与您习惯的不同的JSON表示法.列名存储在一个数组中,而数据存储在另一个数组中.我们实现的解决方案涉及将CFquery更改为数组.然后JSONEncoding那个数组.

您将需要此功能：

<cffunction name="QueryToArray" access="public" returntype="array" output="false"hint="This turns a query into an array of structures.">
    <cfargument name="Data" type="query" required="yes" />

    <cfscript>
        // Define the local scope.
        var LOCAL = StructNew();

        // Get the column names as an array.
        LOCAL.Columns = ListToArray( ARGUMENTS.Data.ColumnList );

        // Create an array that will hold the query equivalent.
        LOCAL.QueryArray = ArrayNew( 1 );

        // Loop over the query.
        for (LOCAL.RowIndex = 1 ; LOCAL.RowIndex LTE ARGUMENTS.Data.RecordCount ; LOCAL.RowIndex = (LOCAL.RowIndex + 1)){

        // Create a row structure.
        LOCAL.Row = StructNew();

        // Loop over the columns in this row.
        for (LOCAL.ColumnIndex = 1 ; LOCAL.ColumnIndex LTE ArrayLen( LOCAL.Columns ) ; LOCAL.ColumnIndex = (LOCAL.ColumnIndex + 1)){

        // Get a reference to the query column.
        LOCAL.ColumnName = LOCAL.Columns[ LOCAL.ColumnIndex ];

        // Store the query cell value into the struct by key.
        LOCAL.Row[ LOCAL.ColumnName ] = ARGUMENTS.Data[ LOCAL.ColumnName ][ LOCAL.RowIndex ];

        }

        // Add the structure to the query array.
        ArrayAppend( LOCAL.QueryArray,LOCAL.Row );

        }

        // Return the array equivalent.
        return( LOCAL.QueryArray );

    </cfscript>
</cffunction>

然后你的回报将如下：

<cfreturn SerializeJson(QueryToArray(getArtists_SQL),true)>

要记住的是,CFquery对象包含其他属性,如recordcount …而且很可能,JS只需要数据.我不知道是否有一个更优雅的解决方案,但这是我们遇到与JQgrid类似问题时的解决方案.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!