Question

我正在使用node webkit，angular and embedded mongodb编写桌面应用程序。

我对select有一个非常奇怪的问题。我有两个模式订单和客户。使用ObjectId向客户订购订单。

我在Order中创建了一个简单的crud，其中包含select on customer字段。这意味着指定客户需要从选择列表中选择他。

打开现有订单进行更新后，客户列表将选择绑定。但是select的值显示为空。列表存在，但输入为空。

一旦我选择了另一个客户并更新一切正常，但选择值只是没有显示在屏幕上。我可以更改客户，这意味着它使用新值更新数据库。问题只出在视图中。

截图：

Sorry can not show list opened

抱歉打开列表无法显示，但所有值都在那里。如果单击“保存”，则会更新数据库。

我只想了解它是如何发生的？我是如何解决的......

我正在构建通用的crud弹出窗口，它会更新并创建我的模型，这是我的代码：

订单型号：

model.factory('Order', function(db,Customer,Payment) {

    var schema = new db.Schema({
        customer : {type: db.Schema.ObjectId, ref:'customer'},
        name : { type: String, required: true },
        date : { type : Date },
        amount : {type:Number,default:0}
    });


    schema.statics.fields = [
        {
            type : 'date',
            name : 'date',
            label : 'Date'
        },
        {
            type : 'select',
            name : 'customer',
            label : 'Customer'
        },
        {
            type : 'text',
            name : 'name',
            label : 'Subject'
        },
        {
            type : 'number',
            name : 'amount',
            label : 'Amount'
        }
    ];

    return db.model('order', schema);
});

弹出指令：

directives.directive('popup', function () {
    return {
        restrict: 'E',
        templateUrl: './views/crud/button.html',
        scope:{
            model : '=',
            type : '=',
            title : '=',
            size : '=',
            id : '=',
            cb : '&'
        },
        compile: function(element, attrs){
            //Default Values
            if (!attrs.entity) { attrs.entity = 0; }
            if (!attrs.cb) { attrs.cb = function(){}; }
            if (!attrs.size) { attrs.size = 'sm' }
        },
        controller:function($scope,$modal){
            $scope.runPopup = function (){
                var modalInstance = $modal.open({
                    templateUrl: './views/crud/popup.html',
                    controller: 'crudPopupCtrl',
                    size: $scope.size,
                    resolve: {
                        settings : function(){
                            return $scope;
                        }
                    }
                });
                modalInstance.result.then(function () {
                    console.log('model saved');
                    $scope.cb();
                }, function () {
                    console.log('Modal dismissed at: ' + new Date());
                });
            }
        }
    };
})

Crud Popup Controller

controllers.controller('crudPopupCtrl', function ($scope,$state,$modalInstance, settings,$injector) {
        //settings is the scope that was passed from directive
        console.log(settings);
        $scope.title = settings.title;
        $scope.model = settings.model;
        if(settings.id){
            settings.model.findOne({_id:settings.id},function(err,entity){
                $scope.entity = entity;
                console.log('entity opened',$scope.entity);
            });
        }else{
            $scope.entity = new settings.model();
        }

        console.log('Opened',$scope.entity);

        //date
        $scope.open = function($event) {
            $event.preventDefault();
            $event.stopPropagation();

            $scope.opened = true;
        };
        $scope.dateOptions = {
            formatYear: 'yy',
            startingDay: 1
        };
        //----


        //need to bring dependent data for selects
        $scope.selects = {};
        switch($scope.model.modelName){
            case 'order':
                var Customer = $injector.get('Customer');
                Customer.find({},function(err,customers){
                    if(err) throw err;
                    console.log('customers',customers);
                    $scope.selects['customer'] = customers;
                    $scope.$apply();
                });



                break;
        }

        $scope.submit = function () {
            if(settings.id){
                console.log('going to update',$scope.entity);
                $scope.entity.save(function(err){
                    if(err) throw err;
                    $modalInstance.close();
                });
            }else{
                settings.model.create($scope.entity,function(err,entity){
                    if(err) throw err;
                    console.log('entity created',entity);
                    $modalInstance.close();
                });
            }
        };

        $scope.cancel = function () {
            $modalInstance.dismiss('cancel');
        };

    });

以前控制器的弹出视图，这是错误：

<div class="modal-header">
    <h3 class="modal-title">{{title}}</h3>
</div>
<form name="entityForm" novalidate ng-submit="submit()">
    <div class="modal-body">
        <div class="form-group" ng-repeat="field in model.fields">
            <label>{{field.label}}</label>
            <div ng-switch="field.type">
                <select ng-switch-when="select" ng-model="entity[field.name]" class="form-control" >
                    <option value="{{select.id}}" ng-repeat="select in selects[field.name]">{{select.name}}</option>
                </select>

                <div ng-switch-when="date">
                    <div class="row">
                        <div class="col-md-6">
                            <p class="input-group">
                                <input type="text" class="form-control" datepicker-popup="dd MMMM yyyy" ng-model="entity[field.name]" is-open="opened"  datepicker-options="dateOptions"   close-text="Close" />
                                  <span class="input-group-btn">
                                    <button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
                                  </span>
                            </p>
                        </div>
                    </div>
                </div>

                <input ng-switch-default type="{{field.type}}" ng-model="entity[field.name]" class="form-control">
            </div>
        </div>
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary" type="submit" ng-disabled="entityForm.$invalid">Save</button>
        <button class="btn btn-warning" type="button" ng-click="cancel()">Cancel</button>
    </div>
</form>

这里我选择了选项，这是选择＆＃39;。我知道我的选项是以非角度的方式实现的，我首先尝试使用具有相同效果的ng-options。

这是我的尝试：

ng-options="item.id as item.name for item in selects[field.name]"

Angular Mongo Db，选择问题

0 个答案: