无法使用ng-controller走动

Question

我是AngularJS的初学者，试图用它来构建一个模板。

我的points.html页面是这样的：

          <form ng-app="stdapp"  ng-submit="save()" ng-controller="SubmissionController">

                <div class="select">
                    <label> Select Student </label>
                    <select ng-options="student.name for student in students" ng-model="student"></select>
                </div>
                <div class="checkbox">
                    <label ng-repeat="behavior in behaviors">
                      <input type="checkbox" ng-model="behavior"> {{behavior.name}}
                    </label>
                </div>
                <div>
                    <button type="button" class="btn btn-info">Mark</button>
                </div>
            </form>

我的points.js是这样的：

 var app = angular.module('stdapp', []);
app.controller('SubmissionController', function($scope, $http) {
    $scope.save = function() {
        console.log($scope.student);
        console.log($scope.behavior);
};

$http.get("/manager/api/std/useraccount/").success(function(response) {
    $scope.students = response.objects;
}).error(function() {
    alert("An Unexpected error occured");
});

$http.get("/manager/api/std/behavior/").success(function(response) {
    $scope.behaviors = response.objects;
}).error(function() {
    alert("An Unexpected error occured");
});
});

这些API运行良好，我从服务器获得了json格式的数据。这是第一个API GET调用的响应:-

{
    "meta": {
        "limit": 20, "next": null, "offset": 0, "previous": null, "total_count": 3}, 
    "objects": [
        {"age": 12, "clas": 5, "id": "559f55347abead2404a61563", "name": "harish", "resource_uri": "/manager/api/std/useraccount/559f55347abead2404a61563/", "studentid": 1}, 
        {"age": 13, "clas": 5, "id": "559f555a7abead2404a61564", "name": "zaya", "resource_uri": "/manager/api/std/useraccount/559f555a7abead2404a61564/", "studentid": 2}, 
        {"age": 11, "clas": 5, "id": "559f556f7abead2404a61565", "name": "harsha", "resource_uri": "/manager/api/std/useraccount/559f556f7abead2404a61565/", "studentid": 3}
    ]
}

第二个get的json应答是

{
"meta": {"limit": 20, "next": null, "offset": 0, "previous": null, "total_count": 3}, 
"objects": [
    {"id": "559f560b7abead2404a61566", "name": "Doing Homework", "points": 3, "resource_uri": "/manager/api/std/behavior/559f560b7abead2404a61566/"}, 
    {"id": "559f56227abead2404a61567", "name": "Disrrupting Class", "points": -2, "resource_uri": "/manager/api/std/behavior/559f56227abead2404a61567/"},         
    {"id": "559f56337abead2404a61568", "name": "Helping", "points": 5, "resource_uri": "/manager/api/std/behavior/559f56337abead2404a61568/"}]}

但是我仍然不能在我的模板中正确地呈现接收到的对象数组。

我写了一个表单，因为最后我想提交选定的数据，所以我也想知道在这种情况下如何编写提交($http.post())。

谁能帮帮我，我试过谷歌，但我得到的例子要么是非常高级的，要么是非常基础的。

Answer 1

除非添加ngModel指令，否则模板不会呈现。这是必需的属性，因为绑定数据到表单控件没有任何意义，如果没有机制来获取数据以进行进一步的处理(提交)。

您的HTML应该是这样的：

    <div class="select" ng-controller="PointspageController">
        <label> Select Student </label>
        <select ng-options="student.name for student in students" ng-model="student.name"></select>
    </div>

然而，这只是一个问题。你需要确保你接下来要做的事情：

1. 将你的超文本标记语言放入像ng-controller="SubmissionController"这样的公共控制器中，在那里你可以定义要用作提交处理程序的函数：

app.controller('SubmissionController'，function($scope) { $scope.save = function() { console.log($scope.student)；}；})；

• 在表单上添加ngSubmit指令：