2016-09-07 53 views
1

我使用角度js,结合角度ui,在我的网站上显示模态窗口。我的HTML代码:角js:ng-min ng-max

<script type="text/ng-template" id="myModalContent.html"> 
    <div class="modal-header text-center"> 
     <h3 class="modal-title" id="modal-title">Jump to page</h3> 
    </div> 
    <div class="modal-body text-center" id="modal-body"> 
     <input type="number" ng-model="info.page" class="text-center" ng-enter="ok()" ng-min="{{info.min}}" ng-max="{{info.max}}" /> 
     <div>MAX: {{info.max}}</div> 
     <div>MIN: {{info.min}}</div> 
     <button class="btn btn-primary" type="button" ng-click="ok()" style="margin-top: 20px;">OK</button> 
    </div> 
</script> 

用户具有范围的info.max填补输入号码info.min

这里的相关角码 - 触发模式窗口打开:

function gotoPageDialog(fileNo, current, max) 
{ 
    var modalInstance = $uibModal.open({ 
     templateUrl: 'myModalContent.html', 
     controller: 'ModalInstanceCtrl', 
     size: 'sm', 
     resolve: { 
      current_info: function() 
      { 
       return { 
        fileNo: fileNo, 
        page: current, 
        max: max, 
        min: 1 
       } 
      } 
     } 
    }); 

    modalInstance.result.then(function (result) 
    { 
     //... 
    }; 
} 

和模态窗口,它的自我:

app.controller('ModalInstanceCtrl', function ($scope, $uibModalInstance, current_info) 
{ 
    $scope.info = current_info; 

    $scope.ok = function() 
    { 
     $uibModalInstance.close($scope.info); 
    }; 

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

结果是:

enter image description here

输入值是“-1”,什么意思是ng-minng-max范围不起作用。

我在做什么错了?

谢谢。

+0

我没有想到ng-min/ng-max应用了HTML5验证?检查你的'$ form'对象,我会想象它将'$ form。$ valid'返回为false。 –

回答

3

变化NG-min和NG-MAX到

分钟= “{{info.min}}”

max =“{{info.max}}”

2

更改ng-minng-max sintax到

ng-min="{{info.min}}"

ng-max="{{info.max}}"

+0

你说得对。我改变了它。但是,这并没有解决问题。同样的行为。 – No1Lives4Ever

+1

您是否尝试手动插入* ng-max和ng-min的值?例如:ng-max =“2”。看看这种方式是否有效:在这种情况下,我们会知道这是你的变量问题,而不是指令问题。 – Luxor001

+0

手动值没有解决问题。同样的行为。我发现使用这个'min =“{{info.min}}”max =“{{info.max}}”“解决了这个问题。谢谢! – No1Lives4Ever