5

私はColdFusionバックエンドでAngularJSを取得しようとしていますが、いくつかの障害に直面しています。彼らの「ToDo」アプリhttp://angularjs.org/をCFArtGalleryデータベースで変更しています。AJAXを使用してColdFusionCFCを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","Buntel"],
    ["Taylor Webb","Frazier"],
    ["Mike","Nimer"]
]}

これは、デモで使用されているAngularの表記とは異なります。

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

誰かが私にこれを正しく機能させる方法について正しい方向を示すことができますか?理想的には、CFCをそのままにして、inを別のアプリケーションで再利用できるようにし、JSON操作をJavascriptの最後で実行する必要があるようにします。

4

3 に答える 3

7

デフォルトでは、Coldfusionは以前とは異なるJSON表記を使用します。列名は1つの配列に格納され、データは別の配列に格納されます。私たちが実装したソリューションには、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で同様の問題が発生したときに私たちが着手した解決策です。

于 2013-02-25T18:25:37.053 に答える
2

ブレイズからの上記の答えと一緒に行くこと。私が使用するqueryToArrayは、クエリオブジェクトのcolumnListを調べます。これは、列エイリアスの場合が保持されるようにするためです。それ以外の場合は、JSONのすべてのキャップになります

/**queryToArray
*  utility method to keep the code dry.
*  @hint does exactly what the name says, take a query, makes it an array of stucts
*  @hint columnLabels pass in a list of columnLabels to just return those columns
*/
public array function queryToArray(required query data, any columnLabels=false){
    var columns = listToArray(arguments.data.columnList);
    if(arguments.columnLabels != false){
            columns = listToArray(arguments.columnLabels);
    }

    var queryArray = arrayNew(1);

    for(i=1; i <= arguments.data.RecordCount; i++){

            row = StructNew();
            for (j=1; j <= ArrayLen(columns); j++){
                columnName = columns[j];
        row[columnName] = arguments.data[columnName][i];
            }
            arrayAppend(queryArray, row);
    }
    return(queryArray);
}
于 2013-08-21T02:25:58.627 に答える
2

または、JavaScriptでこのヘルパー関数を使用して、クエリを(共通の)キー値オブジェクト配列として取得できます。



    function CFQueryParser(data) {
        let items = [];
        Object.keys(data.DATA).forEach((i) => {
            let item = {};
            Object.keys(data.COLUMNS).forEach((j) => {
                item[data.COLUMNS[j]] = data.DATA[i][j];
            });
            items.push(item);
        })
        return items;
    }


于 2018-04-25T19:49:40.103 に答える