All geek questions in one place

Use Coldfusion result set in AngularJS

I am trying to use AngularJS in my cfm files to display data from a cfquery result set. I used the code below in my cfm file. I do not see any conclusion. PS I am really new to AngularJS. So if anyone can help me, it will be great.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html ng-app="Demo">

<head>
  <link rel="stylesheet" href="/Applications/_Common/style.css" type="text/css">
</head>

<body>
  <cfsetting enablecfoutputonly="Yes">
    <CF_GetProjectData project_number=349246 query_name="GetProject">
      <div ng-controller="DemoController">
        <div ng-repeat="number in project">
          {{number.project_number}} - {{number.project_name}}
        </div>
        <!-- <input name="imprint" type="text" size="10" ng-model="first">
        <p>{{first}}</p> -->
      </div>

      <cfoutput>
        <script language="JavaScript" src="/CFIDE/scripts/wddx.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
        <script language="text/javascript">
          var theProjectArray; < cfwddx action = "CFML2JS"
          input = "#GetProject#"
          toplevelvariable = "theProjectArray" >
        </script>
        <script>
          var Demo = angular.module("Demo", []);
          Demo.controller("DemoController", function($scope) {
            $scope.project = theProjectArray;
            alert(theProjectArray);
          });
        </script>
      </cfoutput>

      <cfsetting enablecfoutputonly="No">
</body>

</html>
Run code
+4
source share
2 answers

I'm not sure about Angular.js, but based on the code you posted, it seems you need to wrap ng-controller divin cfoutput. This is due to what you installed enablecfoutputonly="Yes". This way only content inside will be displayed cfoutput.

+3

CF, Angular. Angular MVC , (SoC). , - (ORM) CF, , .

,

  • script.
  • theProjectArray var, . , ?
  • toplevelvariable = "TheProjectArray" > ... -o?

, , console.log(theProjectArray); . console.log(theProjectArray); , , .

factory Angular, CFC. , , ColdFusion, . , ColdFusion.

var myapp = angular.module("test.myapp", [])


    myapp.controller("MyController", function($scope, getevent) {
        $scope.myData = {};
        $scope.myData.doUpdate = function(item, event) {

            getevent.GetProgram(item).success(function(data, status, headers, config) {
                                             console.log(data.DATA);
                                              $scope.test = data.DATA;
                                              $scope.test.DATE = new Date(data.DATA.DATESTART);
                                          });

            getevent.GetProgram(item).error(function(data, status, headers, config) {
                                               console.log("FAILED: "+item);
                                               alert("AJAX failed!");
                                           });
        }
    });




    myapp.factory('getevent', function($http){
        return {
                GetProgram: function(item) {
                    var programInfo = '/foundation/cfc/calendar.cfc?method=getevent&eventid='+item;
                    return $http.get(programInfo);
                }
                };
    });
+1

Source: https://habr.com/ru/post/1616063/

More articles:


All Articles