angularjs嵌入visualforce页面答案

【问题标题】：angularjs embed with visualforce pageangularjs嵌入visualforce页面
【发布时间】：2016-09-13 19:44:47
【问题描述】：

我尝试在 VF 页面中嵌入一个 Angular js 脚本。但我收到两个错误：

/*ajpage:16 Uncaught SyntaxError: Unexpected token 。 angular.min.js:40 未捕获的错误：[$injector:modulerr] http://errors.angularjs.org/1.5.8/$injector/modulerr?p0=app&p1=Error%3A%20%…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.8%2Fangular .min.js%3A20%3A390)

ajpage:

apex:page doctype="html-5.0"  sidebar="false" showHeader="false">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<div ng-app = "app" ng-controller="myCtrl">
<p>Please upload you file:</p>
<p><input type="file"  ng-model="allText"/></p>
<button ng-click="readCSV()">Upload</button>
<button ng-click="extractfile()">test</button>
</div>
<div ng-repeat="f in constr">
    {{constr}}
</div>
<script>
var app = angular.module('app',[]);
.controller('myCtrl', myCtrl);
function myCtrl($scope) {
    $scope.$log = $log;
    $scope.readCSV = function($scope) {
        var allTextLines = $scope.allText.split(/\r\n|\n/);
        for ( var i = 0; i < allTextLines.length; i++) 
                  {
           var tarr = [];
           tarr.push(allTextLines[i]);
           }
    };
    $scope.extractfile = function(tarr) {
    var constr[];
    var deployobj ={
                         "Componenttype": Componenttype,
                         "ComponentApiname":ComponentApiname,
                     };
        deployobj.push(tarr);
        for (var j=0;j<$scope.deployobj.length;j++)
         {
         var str1 = "<members>";
         var str2 = "</members>";
         if ($scope.deployobj[j].Componenttype=== customobject) 
         {
         var result = str1 +" "+$scope.deployobj[j].Componenttype+" "+str3;
        $scope.constr.push(result);
        }
} 
};
}
</script>
</apex:page>

谁能帮我解决这个问题。

【问题讨论】：

标签： angularjs

【解决方案1】：

试试这个方法。

var app = angular.module('app',[]); .controller('myCtrl', function(){

//所有功能都在这里注入。

});

【讨论】：

【解决方案2】：

<apex:page doctype="html-5.0"  sidebar="false" showHeader="false">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<div ng-app = "app" ng-controller="myCtrl">
<p>Please upload you file:</p>
<p><input type="file"  ng-model="allText"/></p>
<button ng-click="readCSV()">Upload</button>
<button ng-click="extractfile()">test</button>
</div>
<div ng-repeat="f in constr">
    {{constr}}
</div>
<script>
var app = angular.module('app',[]);
.controller('myCtrl', function(){
    $scope.readCSV = function($scope) {
        var allTextLines = $scope.allText.split(/\r\n|\n/);
        for ( var i = 0; i < allTextLines.length; i++) 
           {
           var tarr = [];
           tarr.push(allTextLines[i]);
           }
    };
    $scope.extractfile = function(tarr) {
    var constr[];
    var deployobj ={
                         "Componenttype": Componenttype,
                         "ComponentApiname":ComponentApiname,
                     };
        deployobj.push(tarr);
        for (var j=0;j<deployobj.length;j++)
         {
         var str1 = "<members>";
         var str2 = "</members>";
         if ($scope.deployobj[j].Componenttype=== customobject) 
         {
         var result = str1 +" "+deployobj[j].Componenttype+" "+str3;
        $scope.constr.push(result);
        }
} 
};
});
</script>
</apex:page>

更改代码

【讨论】：