使用ajax

时间:2016-03-03 14:19:41

标签: javascript jquery angularjs ajax

我在基于AngularJS的网站上有一个页面,其内容通过ajax加载到div中。我的问题是加载的内容和控制器中的Angular指令似乎被忽略了。如何让控制器工作?

HMTL:

<a href="javascript:void(0)" id="loadContent">Load Content</a>

<div id="myForm-con">
</div>

<script src="js/angular.min.js"></script>
<script src="js/app.js"></script>
<script type="text/javascript">
  $('#loadContent').on('click', function() {
    $.post("load-my-form.php", function(data, result) {
      $('#myForm-con').html(data);
    });     
  });
</script>

app.js

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

    app.controller('validationCtrl', ['$scope',
        function ($scope) {
            $scope.submitForm = function () {
                $scope.submitted = true;

                if ($scope.myForm.$valid) {
                    alert('form is valid');
                }
            }
        }
    ]);
})();

HTML ajax加载表格

<div ng-controller="validationCtrl">
  <form id="my-form" name="myForm" ng-submit="submitForm()" novalidate>
    ...
  </form>
</div>

2 个答案:

答案 0 :(得分:0)

我可能会尝试这样的事情:

<强> HTML

namespace ConsoleApplication1 { public struct MatrixVariables { public int x, y; public MatrixVariables (int lowerV, int upperV) { x = lowerV; y = upperV; } } class Program { static void Main(string[] args) { int[,] a = new int[,] { { 0, 1, 1, 0 },{0,0,1,0}, {1,0,1,1}, {1,1,1,1}, {1,0,0,1} }; int[,] t = new int[,] { { 30, 10, 50, 25, 14 } }; MatrixVariables upperV = new MatrixVariables(); MatrixVariables lowerV = new MatrixVariables(); int maxP = 6; int maxV = 6; int p = 0; int v = 0; for (p=0;p<maxP;p++) { for (v=0; v == maxV;v++) { if (a[p,v] ==1) { if (upperV[v] > t[p]) { upperV[v] = t[p]; } } } } } } }

<强>角

<a href="#" id="loadContent" ng-click="loadContent()">Load Content</a>

或者

<强>角

$scope.loadContent() = $http.post("load-my-form.php", data).then(function (result) {
    $('#myForm-con').html(result);
});  

<强> HTML

$scope.formResults = ''; $scope.loadContent() = $http.post("load-my-form.php", data).then(function (result) { $scope.formResults = result; });

答案 1 :(得分:0)

为了实现这一点,你必须做两件事:

1 - 对.then使用有角度的httpcallback -

$http.post('/someUrl', data, config).then(successCallback, errorCallback); 

2-使用角度data-binding将您的数据与视图相关联,例如 - 2-ways data-binding