0

我正在尝试编写一个简单的 angularapp 以允许教师编辑他们的班级信息。我正在使用 angular-ui 对话框指令来获取灯箱。在 userclick 上，我编写了一个函数来将数据传递给模态并打开对话框。但由于某种原因，数据没有正确绑定。

这是我的controller.js

'use strict';
 define(['app' ], function(app) {
  app.controller('TeacherClasses',
   [ '$scope', '$http', '$dialog','$location', 'teacherClassService',
  function($scope, $http, $dialog, $location,  teacherClassService) {
    $scope.newClass={};
    $scope.show = {"createClassModal": false};
    $http.get('/grades').success(function(data) {
        $scope.grades = data;
    });

    $scope.newClass.grade = "Grade";

    $scope.setGrade = function(grade){
        $scope.newClass.grade = grade;
    };

    $scope.fetchStudentGroups = function(){
        $http.get('/teacher/studentGroups').success(function(data) {
            $scope.studentGroups = data;
        });
    };
    $scope.fetchStudentGroups();

    $scope.createClass = function(){
        $http.post('/studentGroup', $scope.newClass).
          success(function(data, status, headers, config) {
            $scope.show.createClassModal = false;
            //Clearing it out for next time
            $scope.newClass = {};
            $scope.fetchStudentGroups();
          }).
          error(function(data, status, headers, config) {

          });
        console.log($scope.newClass);

    };


    $scope.openDialog = function(studentGroup, dialog){
        $scope.newClass = angular.copy(studentGroup);
        $scope.opts = {
            backdrop: true,
            keyboard: true,
            backdropClick: true,
            templateUrl:  '/assets/partials/teacher/manage/editClassInfo.html',
            resolve: {
                data: function(){
                    return $scope.newClass;
                }
            }
        };
        var modal = $dialog.dialog($scope.opts);
        modal.open();
    }
}]);

return app;
});

这是我的部分

<div class="modal-header">
Edit Class
</div>

<div class="modal-body">
<form class="form-horizontal">
    <div class="control-group">
            <input type="text" ng-model="newClass.name" class="span4">
    </div>

    <div class="control-group">
            <select ui-select2 data-placeholder="Choose a grade" id="grades" class="span4">
                <option></option>
                <option ng-repeat="grade in grades" ng-model="grades" >{{grade}}</option>
            </select>
    </div>
    <label>Students {{newClass.noOfStudents}}</label>
    <label>{{newClass.name}}</label>
</form>
</div>

<div class="modal-footer"></div>

我的模块定义在 app.js

'use strict';
define([ 'angular' ], function(angular) {
    var myModule = angular.module('myApp', 
[ 'ngResource', 'ui', 'infinite-scroll', 'ngDragDrop', 'blueimp.fileupload','ui.bootstrap.dialog', 'ui.bootstrap.modal',
  'ui.bootstrap.dropdownToggle', 'LoadingIndicator', 'http-auth-interceptor']);
myModule.value('ui.config', {
    select2 : {
        allowClear : true
    },
    redactor: {
        plugins: ['fullscreen']
    }
});
return myModule;
});

但是这些值都没有与视图相关联。我在这里做错了什么？

4

0 回答 0