Góc-Kendo và phạm vi $. $ Áp dụng()

Question

Vui lòng xem phần Xem bên dưới và bộ điều khiển bên dưới. Trên sự kiện ng-change trên các phần tử bộ chọn ngày, các hàm được gọi là thay đổi giá trị xác định giới hạn trên hoặc dưới của giá trị khác.

Tôi biết rằng tôi cần vẽ lại thanh công cụ kendo để xem giá trị cập nhật và tôi nên làm theo chỉ thị nhưng kinh nghiệm hạn chế của tôi khiến tôi bị kẹt. Tôi giả định phạm vi $. $ Apply() được gọi sau khi cập nhật phạm vi sẽ làm điều đó nhưng nó không thực hiện thủ thuật.

Tôi nên làm điều này như thế nào theo kiểu góc?

// Home View 
<button id="date-button" type="button" kendo-button ng-click="showModal();"> 
    Variance Analysis 
    <br /> 
</button> 
<div id="spinner" class="loading" style="display:none;"> 
    <div class="loading-dot"></div> 
    <div class="loading-dot"></div> 
    <div class="loading-dot"></div> 
    <div class="loading-dot"></div> 
</div> 

<div class="row"> 
    <br /> 
    <br /> 
    <br /> 
    <div class="col-lg-6 col-lg-offset-3"> 
     <h1>Select Two Months to Compare</h1> 
     <br /> 
     <br /> 
     <br /> 
     <div class="col-lg-6"> 
      <input kendo-date-picker ng-model="dates.fromDate" k-ng-model="dates.actualFromDate" k-options="datePicker1Options();" ng-change="setMaxDate();" /> 
     </div> 
     <div class="col-lg-6"> 
      <input kendo-date-picker ng-model="dates.untilDate" k-ng-model="dates.actualUntilDate" k-options="datePicker2Options();" ng-change="setMinDate();" /> 
     </div> 
     <div class="row"> 
      <br /> 
      <br /> 
      <br /> 
      <div class="col-lg-2 col-lg-offset-4"> 
       <button kendo-button ng-click="go();" style="width:100%;">Go</button> 
      </div> 
     </div> 
    </div> 
</div> 




// Home Controller 
app.controller('HomeCtrl', ['$scope', '$http', '$location', 'data', function ($scope, $http, $location, data) { 
    $scope.dates = {}; 
    $scope.dates.untilDate; 
    $scope.dates.fromDate; 
    $scope.dates.actualUntilDate; 
    $scope.dates.actualFromDate; 

    $scope.minDate = new kendo.data.ObservableObject({ 
     date: new Date(1970) 
    }); 

    $scope.maxDate = new kendo.data.ObservableObject({ 
     date: new Date() 
    }); 

    $scope.setMaxDate = function() { 
     var date = new Date($scope.dates.actualFromDate); 
     date.setMonth(date.getMonth() + 1); 
     $scope.maxDate.date = date; 
     // $scope.$apply(); 
    } 

    $scope.setMinDate = function() { 
     var date = new Date($scope.dates.actualUntilDate); 
     date.setMonth(date.getMonth() - 1); 
     $scope.minDate.date = date; 
     // $scope.$apply(); 
    } 


    $scope.datePicker1Options = function() { 
     return { 
      animation: { 
       close: { 
        effects: "fadeOut zoom:out", 
        duration: 300 
       }, 
       open: { 
        effects: "fadeIn zoom:in", 
        duration: 300 
       } 
      }, 
      format: "MMM yyyy", 
      start: "year", 
      depth: "year", 
      min: $scope.minDate.date 
     } 
    } 


    $scope.datePicker2Options = function() { 
     return { 
      animation: { 
       close: { 
        effects: "fadeOut zoom:out", 
        duration: 300 
       }, 
       open: { 
        effects: "fadeIn zoom:in", 
        duration: 300 
       } 
      }, 
      format: "MMM yyyy", 
      start: "year", 
      depth: "year", 
      max: $scope.maxDate.date 
     } 
    } 

    $scope.go = function() { 
     data.fetch($scope.dates.fromDate, $scope.dates.untilDate, $http, $location); 
    } 


}]); 

Answer 1

Nhìn vào mã nguồn, k-rebind là những gì bạn đang sau kể từ góc-kendo không sử dụng các ràng buộc hai chiều, nhưng dường như k-rebind siêu buggy và giữ gửi bất kỳ bài kiểm tra tôi đã làm thành một vòng lặp vô hạn tiêu hóa . Tốt nhất để làm điều này với tác giả.

Ngoài ra, tôi nghĩ rằng có một lỗi logic hai bộ chọn ngày của bạn. Tôi giả định FromDate thực sự cần thiết lập các MinDate mà sẽ cập nhật min tùy chọn DatePicker2

Answer 2

Tôi đang gặp vấn đề tương tự cố gắng để làm mới một mạng lưới Kendo bằng cách sử dụng $ phạm vi. $ Áp dụng() hoặc thuộc tính k-rebind trong html. Trước đây, họ đã trả lại lỗi "Đã xử lý đã được xử lý" và sau này là bằng cách nào đó sẽ giết Chrome bằng một số vấn đề về bộ nhớ.