2015-04-12 29 views
0

我想在使用Angular JS的應用程序中使用Kendo UI日期選擇器作爲註冊表單。所有的文件似乎正確加載,但沒有發生。Kendo UI日期選擇器與Angular JS和要求

要加載我做了以下庫:

main.js(主需要的文件)

/* 
|-------------------------------------------------------------------------- 
| RequireJS app configuration 
|-------------------------------------------------------------------------- 
| Loads the app and config 
| 
*/ 

require([ 
    'libraries' 
], function() { 

    'use strict'; 

    require([ 
     'appBootstrap/app' 
    ], function() { 

    }); 

}); 

的庫文件包含第三方庫和依賴性列表:

/* 
|-------------------------------------------------------------------------- 
| RequireJS external libraries 
|-------------------------------------------------------------------------- 
| Add all third party libraries in here. 
| 
*/ 

require.config({ 

    baseUrl : 'js/', 

    paths : { 
    angular  : '../../vendor/angular/angular.min', 
    ngAMD   : '../../vendor/angularAMD/angularAMD.min', 
    jquery  : '../../vendor/jquery/dist/jquery.min', 
    kendoUI  : '../../vendor/kendo-ui-core/js/kendo.angular.min' 
}, 

shim : { 
    app : { 
     deps : ['angular', 'jquery'] 
    }, 
    ngAMD : { 
     deps : ['angular'] 
    }, 
    kendoUI : { 
     deps : ['angular', 'jquery'] 
    } 
}, 

deps: ['appBootstrap/app'] 

}); 

最後,我告訴應用程序要導入kendo ui指令:

/* 
|-------------------------------------------------------------------------- 
| RequireJS application 
|-------------------------------------------------------------------------- 
| Loads the different application elements. 
| Controllers, Models, Directives, Services, Factories... 
| 
*/ 

define([ 
    'ngAMD', 
    'kendoUI', 
    'jquery' 
], function (config, angularAMD) { 

    'use strict'; 

    var app = angular.module('appModule', [ 
     'kendo.directives' 
    ]); 

    return angularAMD.bootstrap(app); 

}); 

在控制器如果頁面,我已經包括了日期選擇器指令的路徑:

define([ 
    'appBootstrap/app', 
    '../../vendor/kendo-ui-core/js/kendo.datepicker.min', 
    'services/accountsService' 
], function (app) { 

    'use strict'; 

    app.controller('RegisterPlinkerController', function ($scope, $location, $timeout, accountsService) { 

     ... 

    }); 

}); 

並在視圖,我添加了一個日期選擇器:

<input class="form-control" 
     name="date_of_birth" 
     id="date_of_birth" 
     kendo-date-picker 
     ng-model="register.date_of_birth" 
     k-ng-model="dateObject"> 

爲什麼datepicker字段沒有做任何事情(除了顯示標準文本字段)?

請大家幫幫忙嗎? 在此先感謝。

回答

0

您需要檢查dateObject是Date類型,關閉標籤,幷包括所有的CSS和JS文件:

<input kendo-date-picker k-ng-model="dateObject" /> 

kendo.common.min.css 
kendo.common-material.min.css 
kendo.default.min.css 
kendo.material.min.css 

劍道控NG模式由K-NG-模式提供日期類型對象。

也許你需要包括de kendo.core.js或嘗試與kendo.all.js。