Giá trị động trong ng-minlength

Question

Tôi có một hằng số được gọi là Config có chứa thuộc tính task.minlength = 3.

Tôi đang phụ thêm hằng số trong $rootScope:

.run(function($rootScope, Config) { 
    $rootScope.Config = Config; 
}) 

Từ bên trong một khuôn mẫu, tôi muốn thiết lập Config.task.minlength giá trị vào ng-minlength chỉ thị của một đầu vào:

<input type="text" ng-model="newTask" placeholder="Write a new task..." required ng-minlength="{{ Config.task.minlength }}"> 

nào được phân tích một cách chính xác theo tới DevTools:

Tuy nhiên, xác nhận không được kích hoạt:

$scope.form.$error['minlength'] // undefined 

Nó hoạt động tốt khi tôi chỉ cần viết 3 thay vì suy Config.task.minlength.

Giá trị của ng-minlength có phải được mã hóa cứng không? Có bất kỳ công việc xung quanh?

Answer 1

ngModelController không $observe hoặc $eval giá trị của ngMinlength trong bất kỳ cách nào, do đó nó chỉ nhận được các giá trị số nguyên tĩnh.

Tôi tạo ra chỉ của riêng tôi mà sử dụng $observe, Dưới đây là một example:

app.directive('myMinlength',function(){ 
    return { 
    require: 'ngModel', 
    link: function(scope,elm,attr,ngModel){ 

     var minlength = 0; 

     var minLengthValidator = function(value){  
     var validity = ngModel.$isEmpty(value) || value.length >= minlength; 
     ngModel.$setValidity('minlength', validity); 
     return validity ? value : undefined; 
     }; 

     attr.$observe('myMinlength', function(val){ 
     minlength = parseInt(val,10); 
     minLengthValidator(ngModel.$viewValue); 
     }); 


     ngModel.$parsers.push(minLengthValidator); 
     ngModel.$formatters.push(minLengthValidator); 
    } 
    }; 
}); 

Sử dụng nó như vậy:

<input type="text" name="something" my-minlength="{{config.min}}" ng-model="something"> 

Answer 2

Ồ, có một số lỗi cú pháp.

Bạn nên đặt tên cho đầu vào:

<input name="newtask" type="text" ng-model="newTask" placeholder="Write a new task..." required ng-minlength="{{ Config.task.minlength }}"> 

Sau đó, bạn sẽ nắm bắt những lỗi như thế này:

$scope.form.newtask.$error['minlength'] 

Answer 3

Nó không phải là khó khăn để đạt được một giá trị động của ng-minlength. Góc sẽ xem giá trị phạm vi $ và cập nhật cho phù hợp.

Xem Plunker: http://plnkr.co/edit/tMHQq7YIBlvMw7A60H2e?p=preview

khiển

function myCtrl(){ 
    $scope.myMinLength = 5; // could also come from config 
} 

Xem:

<input type="text" ng-model="myString" ng-minlength="myMinLength"> 

Điều quan trọng cần lưu ý, đó là giá trị của ng-minlength không nhất thiết phải trong niềng răng.