Angularjs 角带数据采集器的动态放置

我对角带日期选择器的放置字段有问题。 是否有一种方法可以动态生成placement属性，使其不与窗口高度重叠。[底部，顶部]

这是ng repeat内部的指令

这种方法得到的placement属性是一个空字符串，因为placement属性没有双向绑定

<div class="time_status_container" 
     ng-right-click="calculatePosition($event)" 
     ng-blur="toggleDatepicker()" 
     tabindex="-1" 
     style="outline:none;">

  <div bs-datepicker
       template="template.html"
       container="body"
       ng-model="start_date"
       data-trigger="manual"
       bs-show="show"
       placement="{{showDatePicker.position}}"
       data-max-date="{{ project.end_date }}">
  </div>

  Show Datepicker
</div>

这是应该动态更改的指令

directives
.directive('stone', function() {
    return {
        restrict: 'E',
        replace:true,
        templateUrl: 'template.html',
        controller:function($scope){

            $scope.toggleDatepicker = function(type){
                if(type == "start"){
                    $scope.showDatePicker['start'] = true;
                    $scope.showDatePicker['end'] = false;
                }
                else if(type == "end"){
                    $scope.showDatePicker['start'] = false;
                    $scope.showDatePicker['end'] = true;
                }
                else{
                    $scope.showDatePicker['start'] = false;
                    $scope.showDatePicker['end'] = false;
                }

                console.log($scope.showDatePicker)
            };

            $scope.calculatePosition = function(e){
                var mouseTopPosition = e.clientY || e.pageY;
                var lastKnowWindowHeight = $scope.getLastKnownWindowHeight();
                var datePickerStoneHeight = $scope.getDatePickerStoneHeight;
                var position;

                if((mouseTopPosition + datePickerStoneHeight) > lastKnowWindowHeight){
                    position = "top";
                }
                else{
                    position = "bottom";
                }

                $scope.showDatePicker = { start:true,position:position };
            };
        }
    };
});

---

当然，请确保showDatePicker.position函数确定正确的值并返回该值

directives
.directive('stone', function() {
    return {
        restrict: 'E',
        replace:true,
        templateUrl: 'template.html',
        controller:function($scope){

            $scope.toggleDatepicker = function(type){
                if(type == "start"){
                    $scope.showDatePicker['start'] = true;
                    $scope.showDatePicker['end'] = false;
                }
                else if(type == "end"){
                    $scope.showDatePicker['start'] = false;
                    $scope.showDatePicker['end'] = true;
                }
                else{
                    $scope.showDatePicker['start'] = false;
                    $scope.showDatePicker['end'] = false;
                }

                console.log($scope.showDatePicker)
            };

            $scope.calculatePosition = function(e){
                var mouseTopPosition = e.clientY || e.pageY;
                var lastKnowWindowHeight = $scope.getLastKnownWindowHeight();
                var datePickerStoneHeight = $scope.getDatePickerStoneHeight;
                var position;

                if((mouseTopPosition + datePickerStoneHeight) > lastKnowWindowHeight){
                    position = "top";
                }
                else{
                    position = "bottom";
                }

                $scope.showDatePicker = { start:true,position:position };
            };
        }
    };
});