Question

我正在尝试将时间值分成2个组件，即时间和子午线，但是它们都链接到相同的ng-model值。我的想法是为值设置验证器，这些值将相应地格式化和解析值。但我似乎无法从验证器指令设置选择框的选定选项。

我有一个选择，我填充了以下数组

$scope.timeMeridians   =  [ {id:'am', value:'AM'}, 
                            {id:'pm', value:'PM'}];

和指令make如下

<select ng-model="editingEvent.start_date_time" 
 ng-options="option as option.value for option in timeMeridians" 
 ub-meridian-validator>

到目前为止

和验证器骨架......

angular.module('app.MeridianValidator',[])
.directive('ubMeridianValidator',function($timeout){
    return {

        require: 'ngModel',
        link: function(scope, elem, attrs, ctrl){
                    var valueType;
        // sets model based on view
        ctrl.$parsers.unshift(function(viewValue){
                    return moment().format('YYYY-MM-DD HH:mm Z');
        });
                    // set the view format
        ctrl.$formatters.unshift(function(viewValue){      
                    return scope.timeMeridians[0];
        });
    }
};

N.B。我现在硬编码了选择逻辑，直到我看到值变化。

所以基本上目前，无论传递给它的值是什么，viewValue格式化程序都应返回timeMeridians [0]（即'AM'），但我不会更改视图中的值...

我在它旁边创建了一个输入，并将其连接到复制动作，所有更改都显示在那里就好了，这种通过引用timeMeridians数组中的位置设置选择值的方法可以正常工作控制器，为什么不在formatter指令中？

请帮助：）

Answer 1

我已经意识到这是Angular JS格式化程序的错误使用。实现此目的的正确或更好的方法是使用ng-change指令，该指令将调用控制器函数来执行更新。如果您仍然倾向于保留相对控制器的这个功能，并因此使时间输入可重用，那么您应该将该功能封装到具有自己的控制器的指令中。

如何在angularjs中设置格式化程序中select的值

1 个答案: