UI ng-adminカスタムページでブートストラップ日付ピッカーが動作しません

Question

私はangularjsのほか、ng-adminも使用しています。私のプロジェクトにng-adminを使用しています。私はUIのブートストラップの日付ピッカーを使用しなければならないという点で私はカスタムページを作っている。しかし、ポップアップは来ていない。以下は私のコードです。

ここは私のカスタムページコードです。

<div class="input-group datepicker"> 
    <input type="text" ng-model="rawValue" id="" name="{{ name }}" class="form-  control" 
    uib-datepicker-popup="{{ format }}" is-open="isOpen" ng-required="{{v}}"/> 
<span class="input-group-btn"> 
    <button type="button" class="btn btn-default" ng-click="toggleDatePicker($event)"> 
     <i class="glyphicon glyphicon-calendar"></i> 
    </button> 
</span> 
</div> 

ここは私のJavaScriptコードです。

$scope.rawValue = new Date(); 

$scope.format = "yyyy-MM-dd"; 

$scope.v = true; 
$scope.isOpen = false; 

    $scope.toggleDatePicker = function ($event) { 
    $event.preventDefault(); 
    $event.stopPropagation(); 

    }; 

この点について私を助けてください。

実際には、「index.html」カスタムページにui-bootsrap.min.jsファイルを含めると、datepickerが正常に動作しています。しかし、ng-adminの通常のページの日付ピッカーとフィルタのポップアップは機能しません。

Answer 1

あなたのinputタグでis-open="isOpen"を使用して、コントローラに$scope.isOpen = false;を設定しますが、ボタンのクリックで通話toggleDatePicker機能が$scope.isOpen = true;

を設定しなかったときにトグル

$scope.toggleDatePicker = function ($event) { 
    $event.preventDefault(); 
    $event.stopPropagation(); 
    $scope.isOpen = !$scope.isOpen; 
}; 

ため$scope.isOpen = !$scope.isOpen;を設定する必要がありますがあるためNB：あなたのモジュールに正しく'ui.bootstrap'を注入してください。

angular.module('yourModuleName', ['ui.bootstrap']) 

更新：ui-bootsrapが含まれていなかったng-adminのため

は絶対にあなたはui-bootsrap.min.jsのindex.html にファイルを含める必要があります。したがって、あなたのモジュールは次のようになります：

angular.module('yourModuleName', ['ng-admin', 'ui.bootstrap']);